Centering Horizontal Navigation

[mightychest]

Hi,

I'm having problems centering my footer navigation (just two links: "Disclaimer" and "Site Map"). I started using Expression Web 3 and hasn't that made life so much more difficult! It worked fine before and... I've got myself into a mess basically.

I've checked out loads of articles on this and tried everything. I'm supplying the relevant parts of code. If you guys think the problem might somehow have something to do with the rest of the code please ask and I'll supply the rest.

Thank you.


<div id="footWrap">
<ul>
<li><a href="pages/disclaimer.html">Disclaimer</a></li>
<li><a href="pages/site_map.html">Site Map</a></li>
</ul>
<p>Copyright © 2009 | All Rights Reserved</p>
</div>


#footWrap {
float: left;
clear: both;
border-top: solid thick #3366FF;
background-color: #000099;
width: 100%;
}
#footWrap ul {
display: inline;
float: left;
margin-right: auto;
margin-left: auto;
}
#footWrap ul li {
display: inline;
float: left;
}
#footWrap ul li a, #footlinks ul li #current {
display: block;
line-height: 2em;
margin: 0.2em 1em 0.2em 0;
width: 6em;
color: white;
text-align: center;
text-decoration: none;
background-color: #000099;
}
#footWrap ul li a:hover {
color: #fff;
background-color: gray;
}
#footWrap p {
clear: both;
text-align: center;
color: #FFFFFF;
font: normal 10pt Trebuchet MS, Verdana, Tahoma, Arial;
}

 

[BillyRayPreachersSon]

If you want it centred, why are you floating it left?

Personally, I'd remove the display:inline and float:left from the "#footWrap ul" styling and add an appropriate width (e.g. 20%).

Hope this helps,
Dan



Coedit Limited - Delivering standards compliant, accessible web solutions

Dan's Page [blue]@[/blue] Code Couch:

http://www.codecouch.com/dan/

Code Couch Tech Snippets & Info:

http://www.codecouch.com/

 

[mightychest]

Hi Billy,

Thanks for the tip. It was quite obvious but then again I am not renowned for my powers of perception!

Henry