Use this code. It works in IE8
<style type="text/css" media="all">
#nav {
background: #f2f2f2;
border-bottom: 4px solid #ccc;
border-top: 4px solid #ccc;
float: left;
width: 100%;
overflow: hidden;
position: relative;
}
#nav ul {
clear:left;
float:left;
list-style:none;
margin:0;
padding:0;
position:relative;
left:50%;
text-align:center;
}
#nav ul li {
display:block;
float:left;
list-style:none;
margin: 5px;
padding:5px;
position:relative;
right:50%;
}
#nav li a {
display: block;
padding: 8px 9px;
margin: 0 0 0 1px;
text-decoration: none;
font-weight: bold;
color: #069;
border-right: 2px solid #ccc;
line-height:1.3em;
}
#nav li a:hover {
color: #c00;
background-color: #fff; }
.bl { border-left: 2px solid #ccc; }
</style>
<div id="nav">
<ul>
<li><a href="index.html" class="b1">Home</a></li>
<li><a href="history.html">History & Structure</a></li>
<li><a href="groups.html">Groups</a></li>
<li><a href="constitutions.html">Constitutions</a></li>
<li><a href="concessions.html">Concessions</a></li>
<li><a href="opportunities.html">Opportunities</a></li>
<li><a href="magazines.html">Magazines</a></li>
<li><a href="links.html">Links</a></li>
</ul>
</div>
> I doubt you get questions more basic than this :-[
>
> How do I get this menu bar to centre itself on the page?
> And show its background colour?
>
______________________________________________________________________
css-discuss [[email protected]]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
