Centrering af floated css menu
Hej,Efter en tur på google kan jeg se jeg ikke er den første med dette problem. Men efter at være igennem mange af disse hits er det stadig ikke lykkedes mig at løse problemet.
menu.css:
ul.menu {list-style:none; margin:0; padding:0}
ul.menu * {margin:0; padding:0}
ul.menu a {display:block; color:#000; text-decoration:none}
ul.menu li {position:relative; float:left; /*margin-right:2px */}
ul.menu ul {position:absolute; top:26px; left:0; background:#d1d1d1; display:none; /* opacity:0 ;*/ list-style:none;}
ul.menu ul li {position:relative; border:1px solid #aaa; border-top:none; width:135px; margin:0;}
ul.menu ul li a {display:block; padding:3px 7px 5px; background-color:#d1d1d1}
ul.menu ul li a:hover {background-color:#999999;}
ul.menu ul ul {left:135px; top:-1px}
ul.menu .menulink {/*border:1px solid #aaa;*/ padding:4px 6px 6px; font-weight:bold; background:url(../img/inaktiv.gif); width:125px;}
ul.menu .menulink:hover, ul.menu .menuhover {background:url(../img/aktiv.gif)}
ul.menu .sub {background:#d1d1d1 url(../img/arrow_r.gif) 127px 8px no-repeat}
ul.menu .topline {border-top:1px solid #aaa}
stykesheet.css:
html, body {
margin:0px;
padding:0px;
background-color:#CCCCCC;
border:0px;
font-size:12px;
min-width:975px;
}
div#navbar{
float:left;
background-image:url(baggrund.gif);
height:25px;
width:100%;
}
og menuen indsat i en div på selve siden:
<div id="navbar">
<ul class="menu" id="menu">
<li><a href="noget.php" class="menulink">forside</a></li>
<li><a href="#" class="menulink">nogetandet</a>
<ul>
<li><a href="noget2.php">noget2</a></li>
<li><a href="noget3">noget3</a></li>
</ul>
</li>
</ul>
</div>
Hvordan får jeg centreret menuen så den virker i IE7+ og FF3+?
