I like Divi’s default header with the Logo on the left and the primary menu bar vertically centered on the right. However, in some cases, I move the menu to the bottom of the header. (A lot of times, I will insert a Call Now or Request Quote button above.)
The CSS code to make this happen, is rather simple:
/* Move navigation menu to the bottom of header */
.et_header_style_left #et-top-navigation nav > ul > li > a, .et_header_style_split #et-top-navigation nav > ul > li > a {
padding-bottom: 25px !important;
}
#top-menu-nav {
padding-top: 25px;
}
#et_top_search {
margin-top: 25px;
}
#top-menu li li a {
padding: 6px 10px;
}
That’s all it takes.
If you have questions or experience problems, leave me a message in the comments below.
Thx a lot you made it for me ! Would you know how can i move the navigation menu on the left ? thx
Gus,
Thanks for your comment. If you want the nav menu moved to the left, but still to the right of the logo, this CSS code will accomplish that:
#et-top-navigation {
float: left;
}
However, if you want to move the nav menu to the left of the logo, that would be much more difficult.