Menü läuft über das Divi Logo - Divi-Menü früher auf mobil / Hamburger Menü umstellen

Question

Wie kann ich bei Divi früher auf das Hamburger-Menü (das mobile Menü) umschalten, wenn der Bildschirm / Browser kleiner wird? Bei uns überlappt bei manchen Auflösungen das Menü das Logo, was nicht gut aussieht, beispielsweise auf Tablets oder auf kleinen Bildschirmen.

Answer 1

Mit folgender CSS-Anweisung lässt sich bei Divi festlegen, ab welcher Pixel-Breite des aktuellen Viewports (Browser-Fensters) statt dem Desktop-Menü das Hamburger-Menü angezeigt wird:

/* Mobiles Menü bei weniger als 1201px */
@media only screen and ( max-width: 1200px )
{
#top-menu-nav, #top-menu {display: none;}
#et_top_search {display: none;}
#et_mobile_nav_menu {display: block;}
}

Dabei einfach die 1200 Pixel durch den gewünschten Wert ersetzen, und schon erfolgt die Umschaltung auf das mobile Menü entsprechend früher. Keine Überlappung mehr zwischen Logo und Menü.

Comments

Stark. Funktioniert einwandfrei. Danke für den wertvollen Tipp !