Centering the navigation

[harryd]

How do I center the navigation.

I read some tutorials and I still could not find the answer.

 

#navigation ul

{

padding-left: 0;

margin-left: 0;

color: #000000;

float: left;

width: 100%;

font-family: arial, helvetica, sans-serif;

font-size:14px;

border-top-style:none;

border-right-style: none;

border-bottom-style: none;

border-left-style: none;

background-color: #BAFF75;

}

 

#navigation ul li {

display: inline;

color: #000000;

background-color: #BAFF75;

}

 

Home

Contact Us

Upcoming Shows

About Us

 

Thanks again

HD

[cornetofreak]

try placing the ul element withing div and the css the div for text align center

[harryd]

I did try align center it did not work.

Any other suggestions.

[cornetofreak]

try adding this css to the ul element

 

left:50%

 

and add this css to the li elements

 

right:50%

[Wickham]

Your style for #navigation ul has width: 100% and float: left so it will always be 100% wide starting from the left. Make it a suitable width and add margin: auto; to make the side margins equal and flexible.

{

padding-left: 0;

margin: auto;

color: #000000;

/*float: left;*/

width: 700px;/*whatever is needed*/....................

[harryd]

When I used margin auto the background color showed between nav and header and the nav was still left even when I did change the width to px.

[Wickham]

The advice I gave is the normal way of centering a div which doesn't have position: absolute; if it doesn't work in your case then there must be something in another style affecting it.

 

We need to see your whole page online and be able to download it all and test, including images and css files.