centering navigation menu in wordpress

Question

I'm looking to correct an issue on one of my pages that makes my nav menu take direction from coding that allows content to span the width of the page…see below:

this css code in that page is causing the nav menu to go to sides of page…logo to left…page menu to right:

div.centered-wrapper {
width: 95% !important;
}

this is what my updated code in style.css looks like, enabling the menu to be centered, using text-align:center

#navigation {
text-align: center
position:relative;
z-index:10000;

how can I fix my problem? it only happens on this particular page, because of the div. code

Answer 1

Just add this style to that page-

#header div.centered-wrapper {
width: 1120px !important;
}

That is what You wanted i guess.

Answer 2

Insert into css div.centered-wrapper {display:inline-block;}

Answer 3

I cant comment so I think I have found the answer. I saw in your code that your margin-right is 0 (see image). Switch this to margin-left:0px !important; You can see this as

<div class="percent-three-fourth column-last">

Edit: if you want, you can set both margin-left and margin-right as auto to center. The above is setting the nav on the left. I hope this helps.

Edit 2: Change the 95% to how it is on the other pages.

.centered-wrapper {
width: 1120px;
margin: 0 auto;
}

Answer 4

So the simplest way I found was to wrap your menu in another div, inside the "centered-wrapper" div like this:

<div class='centered-wrapper'>
<div class='newclass'>

</div>
</div>

and then style the new class:

.newclass{ width: 1120px; margin: 0 auto; }