Divi-Menü auf gesamter Seitenbreite darstellen

22. Mai 2022 | CSS-Stylesheet, Divi-Theme

Das Divi-Menu wächst seitwärts, je mehr Inhalte angezeigt werden. Bisweilen kann das Menu dabei «überlaufen» – bzw. zweistöckig dargestellt werden. Dies lässt sich ändern, wenn auf einer Website das Menu von allem Anfang an auf der ganzen Seitenbreite dargestellt wird – und dies auch bei weniger Menupunkten.

Alles, was Sie benötigen, ist ein wenig CSS-Code. Diesen fügen Sie in das Stylesheet des Child-Themes Ihrer WordPress-Seite ein. Sie finden es unter Design/Customizer/Zusätzliches CSS:
.et_pb_fullwidth_menu .et_pb_menu__menu {
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
}
 
.et_pb_fullwidth_menu .et_pb_menu__menu > nav > ul {
    justify-content: space-between;
}
 
.et_pb_fullwidth_menu .et_pb_menu__menu, 
.et_pb_fullwidth_menu .et_pb_menu__menu > nav, 
.et_pb_fullwidth_menu .et_pb_menu__menu > nav > ul, 
.et_pb_menu .et_pb_menu__menu, 
.et_pb_menu .et_pb_menu__menu > nav, 
.et_pb_menu .et_pb_menu__menu > nav > ul {
  flex-grow: 1;
}
Das Divi-Menu wird nun auf der gesamten Seitenbreite dargestellt. Auch bei weniger Navigationspunkten.

Werbung

Werbung

 

Kostenlose WordPress- und Divi-Tricks im Abo

Wir schicken Ihnen sporadisch (weniger als 10x jährlich) neue Tricks für Wordpress und das Divi-Theme, aber auch hilfreiche CSS- und HTML-Codes frei Haus.

Füllen Sie zur Anmeldung das folgende Formular aus. Angaben mit * sind Pflichtangaben.









Vielen Dank.

Pin It on Pinterest

Share This