Hey there isaaccallan,
You’ve got a nice site there 🙂
This is definitely possible with some custom CSS. To center the navigation on your site please try adding the following CSS code in the style.css file of your child theme or if your theme doesn’t have custom CSS tab add it in your site using the following plugin:
http://wordpress.org/plugins/simple-custom-css
nav#mainnav {
margin-left: auto;
margin-right: auto;
width: 713px;
}
This should center the menu. Hope this helps 🙂
Best regards,
Bojan
Hi Bojan,
Thank you very much, appreciate that. Any idea how to space them evenly across? So that they fill the whole nav bar?
Thanks again an thank you for the compliment!
Hey again isaaccallan,
Hey again isaaccallan,
In that case please remove the code I gave gave you in my previous post and add the following:
@media screen and (min-width: 961px) {
ul#mainnav-menu {
display: table !important;
width: 100%;
}
#mainnav-menu li {
float: none;
display: table-cell;
text-align: center;
}
}
This should spread them across 100% of the container. Normally I wouldn’t suggest the use of the !important declaration. However, it can sometimes be a necessary evil when over-writing existing styles. You can find more information on the use of important here:
https://developer.mozilla.org/en-US/docs/Web/CSS/Specificity#The_!important_exception
Hope this helps 🙂
Best regards,
Bojan
