Hiacynta Hess
Webdesignerin
Aktualisiert am:
In Divi hat das Drop-Down-Menü standardmäßig eine feste Breite, die sich nicht an der Anzahl der Zeichen eines Menüpunkts orientiert. Bei zu langen Menüpunkten rutschen die Buchstaben in die zweite Zeile, das schaut unprofessionell aus. Um dieses Problem zu lösen, kannst du einen speziellen CSS-Code einbinden. Mit diesem Code lässt sich die Breite des Drop-Down-Menüs individuell steuern. Den Code fügst du bei den Divi Theme Optionen unter Eigene CSS ein.
CSS Code für Header, die mit dem Customizer erstellt wurden:
/* Drop Down Menu breiter machen - Customizer Code */
@media screen and (min-width: 981px) {
.sub-menu {
min-width: 300px;
}
#top-menu li li a {
width: 260px;
padding: 4px 12px;
}
}
CSS Code für Header, die mit dem Theme Builder erstellt wurden:
/* Breite Innen Drop-Down-Menu*/
.et-menu li li a {
padding: 6px 20px;
width: 260px;
}
/* Breite Aussen Drop-Down-Menu*/
.nav li ul {
position: absolute;
padding: 20px 0;
width: 300px;
}
Bei width kannst du die Breite des Drop-Down-Menüs anpassen. Hier musst du einfach nur etwas mit den Zahlen spielen, bis die Breite für dich passt.