ORZ-Header bei Mobilfunkdarstellung abgeschnitten

Dominik Wolff

Moin,

ich nutze ein Wordpress-Theme für meine Website, das auf Mobilgeräten automatisch die Ansicht anpasst ("responsive").

Nun habe ich das ORZ-Widget auf einer nicht-öffentlichen Testseite installiert und muss feststellen, dass es auf dem Smartphone aufgeklappt den ganzen Screen bis über den Header hinaus einnimmt, wobei die Möglichkeit zum Schließen des Widgets vom Header verdeckt wird. Den Header kann ich nicht kleiner machen, da dort das Menü-Symbol liegt, im Widget wäre aber nach unten noch massig Platz.

Ich habe einen Screenshot angehängt, bei dem ich den Header zu Demonstrationszwecken transparent gemacht habe. Hier kann man erkennen, dass die "Hier-klicken-zum-Schließen"-Region für den User nicht zu erreichen ist.

Wie komme ich aus dieser Nummer raus?

Madita Poslovsky

Guten Morgen Herr Wolff,

ich habe Ihr Anliegen an meine Entwickler weitergeleitet. Sobald ich eine Rückmeldung habe, gebe ich Ihnen Bescheid.

Beste Grüße
Madita Poslovsky

Nicolas Happ

Hallo Herr Wolff,

das Problem ist dass der Header Ihrer Seite sehr weit "oben" auf der Z-Achse der Seite liegt und daher die ORZ überdeckt. Sie können das Problem ganz einfach beheben, indem sie in Wordpress den CSS z-index Ihres Headers (

) von seinem aktuellen Wert 9999 auf z. B. 20 runtersetzen. Dann liegt der Header im ausgeklappten Zustand der ORZ nicht mehr über ihr.

Viele Grüße
Nicolas Happ

Dominik Wolff

Hallo Herr Happ,

danke für den Tipp, genau das war das Problem. Ich habe einen Custom-CSS-Code in die entsprechende Datei eingefügt:

@media only screen and (max-width: 1000px) {

    #header-outer {

        z-index: 20 !important;

    }

}

Jetzt klappt es problemlos.

Falls jemand ein ähnliches Problem hat, hier noch folgende Infos:

WP-Theme: Salient
Ort der Einstellung: WP-Backend → Salient → General Settings → CSS/Script Related → Custom CSS Code

Danke für die schnelle Lösung!