Divi » Breadcrumbs » Module

Launch offer - 30% off

If you change the height of the logo in the Divi Theme you may find that the links to the right of the header bar are no longer nicely vertically centered in the header bar.

This happens because Divi uses a fixed amount of padding to move the links into the correct position vertically. But this only works if the logo is set to the default size. A larger logo will make the header bar taller, but the padding around the links won’t change.

We can fix this by using the following CSS to vertically center the links and search icon in the header area:

@media only screen and ( min-width: 981px ) { 

	/* Vertically center the top navigation */
	#et-top-navigation { display:table-cell; vertical-align: middle; float:none !important;}
	.container { display:table; }

	/* Right align the contents of the top navigation area */
	#et-top-navigation { text-align:right; }
	#et-top-navigation > * { text-align:left; }
	#top-menu-nav, #et_top_search { float:none !important; display:inline-block !important}
	#et_top_search { vertical-align: top !important; margin-top:3px }

}