Center Menu Bars in Minimum

[Brittany]

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!

http://www.livelaughstudios.com/blog

[Tony @ AlphaBlossom]

Hello,

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).

---

Tony Eppright | http://www.AlphaBlossom.com | Follow me on twitter @_alphablossom

[Brittany]

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?

Thanks again!

[Tony @ AlphaBlossom]

Hi Brittany,

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:


.sub-menu {
text-align: left;
}


and also add any padding you'd like.

Hope that helps!

---

Tony Eppright | http://www.AlphaBlossom.com | Follow me on twitter @_alphablossom

[Brittany]

annnnd your help did it, yet again. Thank so much!

[Tony @ AlphaBlossom]

You're welcome, Brittany! Have a great day.

---

Tony Eppright | http://www.AlphaBlossom.com | Follow me on twitter @_alphablossom

[Author]

Posts