How to center align Divi secondary menu

When you add any of the optional elements into your Divi secondary header navigation they will appear left aligned as shown in the 1st navigation menu below.

If you want to move the secondary menu telephone, email, and social icons to the center of your navigation as shown in the 2nd navigation below, you can use a few lines of CSS in your Theme Options or child theme stylesheet.

You can follow our other post If you would like to right-align your social media icons in your secondary navigation menu. If you are not sure where you should be adding your CSS you can read our guide on adding custom CSS in Divi.

How to center-align Divi secondary navigation elements

Add the following into your Divi Theme Options Custom CSS box, or into a child theme style sheet;

#et-info {
float: none !important;
text-align: center;}

How to add secondary header elements (Phone, email, social icons)

By default, the secondary menu does not show until you choose to add the optional elements into it. To do this you will need to open your Theme Customizer and navigate to Theme Customizer > Header & Navigation > Header Elements. Here you can add your phone number and email and check or uncheck to add social media icons and show search icons.

• Show Social Icons – If you have defined social profiles (in Divi Theme Options), then you can choose to display these in your secondary header.
• Phone Number – Once you add your phone number in the theme customizer it will display in the secondary navigation bar.
• Email – Once you add your email in the theme customizer it will display in the secondary navigation bar.