nicht angemeldet
Hier der Code, alles hängt an dem display:table was der IE nicht kennt.
Ich wollte halt nicht mit margin-left alles machen um das Menü in die Mitte zu rücken.
[CODE]
#header{
background:url(../images/hg.png) 0 0 no-repeat;
width:981px;
height:180px;
position:relative;
margin:0 auto;
}
#header img.logo{
position:absolute;
left:0px;
top:5px;
z-index:500;
}
/*hintergrund der topnavi*/
.nav {
background: url(../images/navi.png);
position:relative;
left:6px;
top:146px;
font-family:arial, verdana, sans-serif;
font-size:11px;
width:100%;
z-index:500;
}
.nav .table
{
margin-left:250px;
}
.nav .select,
.nav .current {
margin:0;
padding:0;
list-style:none;
display:table-cell;
white-space:nowrap;
}
.nav li {
margin:0;
padding:0;
height:auto;
float:left;
}
/*topnavi-rahmenhalter - begrenzungslinien der buttons*/
.nav .select a {
display:block;
float:left;
padding:0 30px 0 30px;
text-decoration:none;
line-height:27px;
background:url(../images/nav_div.png) 0 0 no-repeat;
white-space:nowrap;
color:#464646;
}
.nav .current a {
display:block;
height:27px;
float:left;
padding:0 0 0 15px;
text-decoration:none;
line-height:27px;
white-space:nowrap;
color:#fff;
}
.nav .current a b {
display:block;
padding:0 30px 0 15px;
}
/*hover-effekte des topmenüs*/
.nav .select a:hover,
.nav .select li:hover a {
background:url(../images/nav_hover.png) 0 0 repeat-x;
padding:0 0 0 15px;
cursor:pointer;
color:#FFF;
}
/*hover-effekte des topmenüs*/
.nav .select a:hover b,
.nav .select li:hover a b {
display:block;
float:left;
padding:0 30px 0 15px;
background:url(../images/nav_hover.png) 0 0 repeat-x;
cursor:pointer;
}
.nav .select_sub {
display:none;
}
/* IE6 only */
.nav table {
border-collapse:collapse;
margin:-1px;
font-size:1em;
width:0;
height:0;
}
/*Posi des submenüs*/
.nav .sub {
display:table;
margin:0 auto;
padding:0;
list-style:none;
}
.nav .sub_active .current_sub a,
.nav .sub_active a:hover {
background:transparent;
color:#FFF;
}
/*submenübox*/
.nav .select :hover .select_sub,
.nav .current .show {
display:block;
position:absolute;
width:969px;
top:27px;
padding:0;
z-index:100;
left:0;
}
.nav .current .show {
z-index:10;
}
/*schrift des submenü*/
.nav .select :hover .sub li a,
.nav .current .show .sub li a {
display:block;
float:left;
background:transparent;
padding:0 10px 0 10px;
margin-left:0px;
white-space:nowrap;
border:0;
color:#FFF;
font-weight:bold;
}
.nav .current .sub li.sub_show a {
color:#469EBF;
cursor:default;
background:url(../menus/back_1.gif);
}
.nav .select :hover .sub li a:hover,
.nav .current .sub li a:hover {
visibility:visible;
color:#469EBF;
background:url(../menus/back_1.gif);
}
[/CODE]
hier der HTML-CODE
[CODE]
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Clan Gilde</title>
<link rel="stylesheet" media="all" type="text/css" href="css/style.css" />
</head>
<body>
<div id="header">
<div class="nav">
<div class="table">
<ul class="select"><li><a href="index.php"><b>Home</b>
</a></li></ul>
<ul class="select">
<li><a href="About.php"><b>About</b><!--[if IE 7]><!--></a><!--<![endif]-->
</li>
</ul>
<ul class="select"><li><a href="Clans.php"><b>Clans</b><!--[if IE 7]><!--></a><!--<![endif]-->
<!--[if lte IE 6]><table><tr><td><![endif]-->
<div class="select_sub show">
<ul class="sub">
<li><a href="SC-Clans.php">Starcraft</a></li>
<li><a href="BW-Clans.php">Broodwar</a></li>
</ul>
</div>
<!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
</ul>
<ul class="select"><li><a href="contact.php"><b>Contact</b><!--[if IE 7]><!--></a><!--<![endif]-->
</li>
</ul>
<ul class="select"><li><a href="xtra.php"><b>X-tra</b><!--[if IE 7]><!--></a><!--<![endif]-->
<!--[if lte IE 6]><table><tr><td><![endif]-->
<div class="select_sub">
<ul class="sub">
<li><a href="help.php">help</a></li>
<li><a href="faq.php">faq</a></li>
</ul>
</div>
<!--[if lte IE 6]></td></tr></table></a><![endif]-->
</li>
</ul>
</div>
</div>
<img src="../images/headerbild.png" class="logo" />
</div>
</body>
</html>
[/CODE]