I’ve been trying most of the morning with no luck, to try and get my menus centered under my header. I have tried a few different things I found in the old forums but I can’t get anything to work.
Any thoughts for me on what needs to be changed in the css to make it work?
Thanks in advance!
For the top menu, in your child theme style.css, change your #header .widget-area to “float:none;” and add “margin: 0 auto;”
Then change #header .menu to “float: none;”
For the lower menu, add “text-align: center;” to .menu-primary, .menu-secondary, #header .menu (around line 304).
Then for .menu-primary li, .menu-secondary li, #header .menu li change to “float: left;” and add “display: inline-block;” (around line 327).
Thank you so much for all that help! I think I’m almost there but maybe missing a little something. The top menu worked perfectly while the lower one still appears to be aligned left.
Do you see something I’ve missed?
It still looks like you have float: left around line 329 (.menu-primary li, .menu-secondary li, #header .menu li). It should be “float: none;”
Also, your submenus are now centered as well (dropdowns). If you want them to be left-aligned, you can add:
and also add any padding you’d like.
Hope that helps!
annnnd your help did it, yet again. Thank so much!
The topic ‘Center Menu Bars in Minimum’ is closed to new replies.
Are you a blogger, web designer, developer, or website owner looking to generate more income?
Promote products for the largest and fastest growing online website platform as part of our affiliate program.