Ich gestalte derzeit ein Menü mit CSS. Im Firefox und in Opera sieht alles genau so aus wie ich es will. Leider zerschießt der IE das Menü. Der letzte Punkt wird immer in der nächsten Zeile dargestellt. Wenn ich Testweise in der CSS auf float:right stelle, dann wird es auch im IE richtig dargestellt (seitenverkehrt).
Hier meine CSS:
body {
background-image: url(../images/bg1.png);
font-family: Arial, geneva, verdana, arial, sans-serif;
}
#table {
border-collapse:collapse;
}
ul.menu {
padding-left: 3px;
padding-right:0px;
}
#menu {
background-position: 1px;
width:890px;
height:88px;
background-repeat:no-repeat;
background-image: url(../images/menuback.png);
}
#header {
background-image: url(../images/Header.png);
width:900px;
height:266px;
background-repeat:no-repeat;
}
#footer {
background-position: 0px;
background-image: url(../images/Footer.png);
width:888px;
height:64px;
background-repeat:no-repeat;
font-weight:bold;
color:#ffffff;
}
#module {
border-left:2px solid #6a6a6a;
width:287px;
vertical-align:top;
}
#impressum {
vertical-align: top;
padding-left: 10px;
font-size:13px;
}
#contenttable {
width:887px;
padding-left:9px;
background-color: #ffffff;
border-left:3px solid #ff6700;
border-right:3px solid #ff6700;
}
.item1 {
display:block;
background-image: url(../images/Homeactive.png);
width:125px;
height:56px;
text-indent: -2000px;
}
li.item1 {
display:block;
color:#000000;
background-image: url(../images/Homeactive.png);
width:125px;
height:56px;
background-repeat:no-repeat;
}
li.item1#current {
display:block;
color:#ffffff;
background-image: url(../images/Home.png);
width:125px;
height:56px;
background-repeat:no-repeat;
}
li {
white-space: nowrap;
padding-right:10px;
float:left;
display:inline;
}
.item1 a {
display:block;
width:125px;
height:56px;
outline:0;
}
.item1 a:hover {
display:block;
width:125px;
height:56px;
outline:0;
background-image: url(../images/Home.png);
}
.item53 {
display:block;
background-image: url(../images/Podactive.png);
width:131px;
height:56px;
text-indent: -2000px;
}
li.item53 {
display:block;
color:#000000;
background-image: url(../images/Podactive.png);
width:131px;
height:56px;
background-repeat:no-repeat;
}
li.item53#current {
display:block;
color:#ffffff;
background-image: url(../images/Pod.png);
width:131px;
height:56px;
background-repeat:no-repeat;
}
.item53 a {
display:block;
width:131px;
height:56px;
outline:0;
}
.item53 a:hover {
display:block;
width:131px;
height:56px;
outline:0;
background-image: url(../images/Pod.png);
}
.item55 {
display:block;
background-image: url(../images/Zutatenactive.png);
width:149px;
height:56px;
text-indent: -2000px;
}
li.item55 {
display:block;
color:#000000;
background-image: url(../images/Zutatenactive.png);
width:149px;
height:56px;
background-repeat:no-repeat;
}
li.item55#current {
display:block;
color:#ffffff;
background-image: url(../images/Zutaten.png);
width:149px;
height:56px;
background-repeat:no-repeat;
}
.item55 a {
display:block;
width:149px;
height:56px;
outline:0;
}
.item55 a:hover {
display:block;
width:149px;
height:56px;
outline:0;
background-image: url(../images/Zutaten.png);
}
.item56 {
display:block;
background-image: url(../images/Rezeptactive.png);
width:128px;
height:56px;
text-indent: -2000px;
}
li.item56 {
display:block;
color:#000000;
background-image: url(../images/Rezeptactive.png);
width:128px;
height:56px;
background-repeat:no-repeat;
}
li.item56#current {
display:block;
color:#ffffff;
background-image: url(../images/Rezept.png);
width:128px;
height:56px;
background-repeat:no-repeat;
}
.item56 a {
display:block;
width:128px;
height:56px;
outline:0;
}
.item56 a:hover {
display:block;
width:128px;
height:56px;
outline:0;
background-image: url(../images/Rezept.png);
}
.item57 {
display:block;
background-image: url(../images/Macheractive.png);
width:133px;
height:56px;
text-indent: -2000px;
}
li.item57 {
display:block;
color:#000000;
background-image: url(../images/Macheractive.png);
width:133px;
height:56px;
background-repeat:no-repeat;
}
li.item57#current {
display:block;
color:#ffffff;
background-image: url(../images/Macher.png);
width:133px;
height:56px;
background-repeat:no-repeat;
}
.item57 a {
display:block;
width:133px;
height:56px;
outline:0;
}
.item57 a:hover {
display:block;
width:133px;
height:56px;
outline:0;
background-image: url(../images/Macher.png);
}
.item58 {
display:block;
background-image: url(../images/Partneractive.png);
width:132px;
height:56px;
text-indent: -2000px;
}
li.item58 {
display:block;
color:#000000;
background-image: url(../images/Partneractive.png);
width:132px;
height:56px;
background-repeat:no-repeat;
}
li.item58#current {
display:block;
color:#ffffff;
background-image: url(../images/Partner.png);
width:132px;
height:56px;
background-repeat:no-repeat;
}
.item58 a {
display:block;
width:132px;
height:56px;
outline:0;
}
.item58 a:hover {
display:block;
width:132px;
height:56px;
outline:0;
background-image: url(../images/Partner.png);
}
Die Seite ist www.kaffeepod-dummy.de.vu
Ich hoffe, dass jemand einen Rat weiß.