I am an independent WordPress web consultant with 10 years of experience in WordPress theme installation, customization, administration, maintenance, support, documentation, troubleshooting and PSD/design to WP.
Sridhar – I follow your wonderful tutorials even though I don’t use Genesis. I recently centered a navigation on a Builder site – http://adam-and-steve.net/ and ran into a problem – if there was not enough content to throw a scroll bar the navigation jumped a few pixels horizontally when navigating from pages with a scrollbar and those without. My hack was to insert a 1px clear png and make it a gazillion frames deep so that the scrollbar would exist no matter how large the monitor. I wonder that will be a problem with Genesis? And if there is a better solution than the 1px gif. Thanks for all your wonderful tutorials!
I have tried a dozen other “sure-fire” ways to center the nav bar on my Genesis/Prose site to no avail until I used your code. Voila!! You are awesome! I will definitely turn to your site for more help in the future…I need it.
Thank you so much! Just wanted to add that I’m working with the Associate theme and tried the first bit of code and it didn’t work. The code for Prose worked beautifully.
So simple and easy. Thank you! I bought a Genesis child theme but didn’t realize how much work it would take to make it look unique and professional. Thanks for making it easy for even me. I feel like I’ve had a crash course in CSS ever since I purchased the theme. Thanks again, now I’m off to peruse the rest of your site.
Sridhar – I follow your wonderful tutorials even though I don’t use Genesis. I recently centered a navigation on a Builder site – http://adam-and-steve.net/ and ran into a problem – if there was not enough content to throw a scroll bar the navigation jumped a few pixels horizontally when navigating from pages with a scrollbar and those without. My hack was to insert a 1px clear png and make it a gazillion frames deep so that the scrollbar would exist no matter how large the monitor. I wonder that will be a problem with Genesis? And if there is a better solution than the 1px gif. Thanks for all your wonderful tutorials!
Hi Karen,
Try http://css-tricks.com/eliminate-jumps-in-horizontal-centering-by-forcing-a-scroll-bar/
Perfecto! You are the best!
Hi Sridhar, thank you for all that you do 🙂
I just dropped this code on the Enterprise Pro stylesheet and the menu centered perfectly.
However when viewing on a mobile device the responsive menu now defaults to the open state.
Any suggestions how to get around this?
I have updated my post with additional CSS for Enterprise Pro.
You are a star Sridhar, thank you! 🙂
Hey Sridhar!
Just wanted to give my take…. I usually just center the text on the parent container, like this:
.nav-primary,
.nav-secondary {
text-align: center;
}
I am surprised that it actually works. I am going to update my post. Thanks Mike.
No prob 😉
I have tried a dozen other “sure-fire” ways to center the nav bar on my Genesis/Prose site to no avail until I used your code. Voila!! You are awesome! I will definitely turn to your site for more help in the future…I need it.
Was working on a website for a friend when I needed this fix… THANK YOU SO MUCH! 🙂
Thanks so much for this – I’ve already used this twice!
THANK YOU 🙂 was most helpful.. for newbies keep in mind you place it after EVERY piece of code then save within CSS.
worked for me, thanks
Thanks so much for your tutorials…I just discovered your site last week and am excited to explore more!
However…I can’t seem to get my menu bar centered, despite entering this code into my style.css. Any thoughts?
Works a charm – thanks!
Thank you so much! Just wanted to add that I’m working with the Associate theme and tried the first bit of code and it didn’t work. The code for Prose worked beautifully.
So simple and easy. Thank you! I bought a Genesis child theme but didn’t realize how much work it would take to make it look unique and professional. Thanks for making it easy for even me. I feel like I’ve had a crash course in CSS ever since I purchased the theme. Thanks again, now I’m off to peruse the rest of your site.
Hello,
how do you achieve that the submenu which you will see when hovering over the parent menu item is aligned centrally under the parent item?
This solution does not appear to work with Altitude Pro?
Do you want logo at left and nav centered in the header, both on the same line?
Hi Sridhar
Actually logo centered above menu and menu centered below…..but I have resolved by fudging it a little
http://hh-devtest.co.uk/drhennessy.com/
Thanks