Hallo,
ich habe bei einer Seite ein CSS Menü eingebaut, das im IE7/FF2 wunderbar funktioniert. Leider macht der IE6 Probleme.
Der div in dem es sich befindet ist 166px breit aber das menü soll nicht die ganze breite benützen. Wie gesagt machen das der IE7 und FF genau nach stylesheet Zuweisung, aber im IE6 spannt es sich über die ganze Breite.
Ich finde einfach nicht raus an was es liegt und wäre sehr dankbar wenn jemand einen Tipp hätte.
Danke!
Zu sehen
hier.
Und hier das CSS des Menüs:
Code:
#button {
width: 164px;
padding: 10px 0 0 11px;
font-family: Tahoma, Arial, sans-serif;
font-size : 10px;
color: #333;
}
#button ul {
list-style: none;
margin: 0;
padding: 0;
border: none;
}
#button li {
border-bottom: 1px solid #FBF999;
margin: 0;
list-style: none;
list-style-image: none;
}
#button li a {
display: block;
padding: 5px 0px 5px 8px;
border-left: 10px solid #FFBB1C;
border-right: 10px solid #D8D34D;
background-color: #FFD46D;
color: #336600;
text-decoration: none;
width: 100%;
}
html>body #button li a {
width: 116px;
}
#button li a:hover {
border-left: 10px solid #F4AB00;
border-right: 10px solid #BCB929;
background-color: #FFBB1C;
color: #336600;
}
#button li #active {
border-left: 10px solid #F4AB00;
border-right: 10px solid #BCB929;
background-color: #FFBB1C;
color: #336600;
}
Und hier das Seiten CSS:
Code:
body {text-align:center; font-family:Verdana, Arial, Helvetica, sans-serif; font-size:10pt; color:#336600; margin:0; padding:0;
background:#FBF999 url(../images/bg.gif) repeat-x fixed center center;
scrollbar-face-color: #FFC924;
scrollbar-highlight-color: #F9BB00;
scrollbar-3dlight-color: #F9BB00;
scrollbar-shadow-color: #F9BB00;
scrollbar-darkshadow-color: #F9BB00;
scrollbar-arrow-color: #D7A200;
scrollbar-track-color: #FFC924;
}
#container {width:920px; text-align:left; padding:0;
position:absolute; margin:-299px 0px 0px -460px; top: 50%; left: 50%;}
#container .wrapper {margin:0; padding:0;}
#container .header {width:920px; height:73px; margin:0; padding:0; background:#FFF url(../images/header.jpg) no-repeat center top;}
#container .column {width:166px; height:500px; float:left; margin:0; padding:0; background:#FBF999 url(../images/bg-nav.jpg) no-repeat center; }
#container .content {width: 754px; height:500px; float:left; padding:0; margin:0; overflow:auto; background:#FBF999 url(../images/bg-main.jpg) no-repeat center top;}
#container .footer { clear:both; width:920px; height:25px; margin:0; padding:0; background:#FFD46D;}