Hi, habe ein Problem mit meiner Navigationsleiste. Unter Firefox funktioniert die Navi aber unter IE nicht. Hoffe Ihr könnt mir Helfen.
HTML:
<div id="nav_horizontal">
<ul id="nav" class="dropdown dropdown-horizontal">
<li class="cottbus"><center><font color="#fff">Cottbus</font></center>
<ul>
</li>
<li><a href="#">Chronik</a></li>
<li><a href="#">Historik</a></li>
<li><a href="#">Stadtgebiete</a></li>
<li><a href="#">Cottbusser Straßen</a></li>
<li><a href="#">Cottbusser Parks</a></li>
</ul>
</li>
<li class="sport"><center><font color="#fff">Sport</font></center>
<ul>
</li>
<li><a href="#">Fußball</a></li>
<li><a href="#" >Turnen</a></li>
<li><a href="#">Radsport</a></li>
<li><a href="#">Reitsport</a></li>
<li><a href="#">Wassersport</a></li>
</ul>
</li>
<li class="freizeit"><center><font color="#fff">Freizeit</font></center>
<ul>
</li>
<li><a href="#">Tierpark</a></li>
<li><a href="#">Planetarium</a></li>
<li><a href="#">Parkeisenbahn</a></li>
<li><a href="#">Messen</a></li>
<li><a href="#">Museen</a></li>
<li><a href="#">Events</a></li>
</ul>
</li>
<li class="kultur"><center><font color="#fff">Kultur</font></center>
<ul>
</li>
<li><a href="#">Staatstheater</a></li>
<li><a href="#">Puppenbühne</a></li>
<li><a href="#">Theater Native C</a></li>
<li><a href="#">Piccolo Theater</a></li>
<li><a href="#">Staatstheater</a></li>
<li><a href="#">Stadthalle</a></li>
<li><a href="#">Weltspiegel</a></li>
<li><a href="#">UCI Kinowelt</a></li>
<li><a href="#">weiter Veranstaltungsorte</a></li>
</ul>
</li>
<li class="bildung"><center><font color="#fff">Bildung</font></center>
<ul>
</li>
<li><a href="#">Cottbusser Schulen</a></li>
<li><a href="#">Volkshochschule</a></li>
<li><a href="#">Tech. Universität</a></li>
<li><a href="#">Fachhochschule</a></li>
<li><a href="#">Bibliotheken</a></li>
</ul>
</li>
<li class="multimedia"><center><font color="#fff">Multimedia</font></center>
<ul>
</li>
<li><a href="#">Gästebuch</a></li>
<li><a href="#">Bildergalerien</a></li>
<li><a href="#">Panoramen</a></li>
<li><a href="#">Videos</a></li>
<li><a href="#">Links</a></li>
<li><a href="#">Awards</a></li>
<li><a href="#">Design</a></li>
<li><a href="#">Link us</a></li>
<li><a href="#">Ausrüstung</a></li>
</ul>
</li>
</div>
HTML:
#nav_horizontal {
position: absolute;
top: 493px;
left: 50%;
height: 30px;
width: 950px;
padding: 11px 0px 0px 0px;
margin-left: -475px;
}
#nav {
position:relative;
top: 1px;
}
ul.dropdown,
ul.dropdown li,
ul.dropdown ul {
list-style: none;
margin: 0;
padding: 0;
}
ul.dropdown {
position: relative;
z-index: 597;
float: left;
}
ul.dropdown li {
float: left;
line-height: 1.3em;
vertical-align: middle;
zoom: 1;
}
ul.dropdown li.hover,
ul.dropdown li:hover {
position: relative;
z-index: 599;
cursor: default;
}
ul.dropdown ul {
visibility: hidden;
position: absolute;
top: 100%;
left: 0;
z-index: 598;
width: 100%;
}
ul.dropdown ul li {
float: none;
}
ul.dropdown ul ul {
top: 1px;
left: 99%;
}
ul.dropdown li:hover > ul {
visibility: visible;
}
ul.dropdown li.rtl ul {
top: 100%;
right: 0;
left: auto;
}
ul.dropdown li.rtl ul ul {
top: 1px;
right: 99%;
left: auto;
}
ul.dropdown {
font-weight: bold;
}
ul.dropdown li {
padding: 10px 10px;
background-color: #1d1d1d;
color: ;
border-style: solid;
border-width: 0px 0px 1px 1px;
border-color: #FFF #FFF #FFF;
}
ul.dropdown a:link,
ul.dropdown a:visited { color: #FFF; text-decoration: none; }
ul.dropdown a:hover { color: #000; }
ul.dropdown a:active { color: #ffa500; }
ul.dropdown ul {
width: 100%;
margin-top: 0px;
}
ul.dropdown ul li {
font-weight: normal;
}
ul.dropdown *.cottbus {
background-color: #1d1d1d;
background-position: 100% 50%;
background-repeat: no-repeat;
border: 0px;
width: 125px;
height: 20px;
}
ul.dropdown *.sport {
background-color: #1d1d1d;
background-position: 100% 50%;
background-repeat: no-repeat;
border: 0px;
width: 138px;
height: 20px;
}
ul.dropdown *.freizeit {
background-color: #1d1d1d;
background-position: 100% 50%;
background-repeat: no-repeat;
border: 0px;
width: 170px;
height: 20px;
}
ul.dropdown *.kultur {
background-color: #1d1d1d;
background-position: 100% 50%;
background-repeat: no-repeat;
border: 0px;
width: 146px;
height: 20px;
}
ul.dropdown *.bildung {
background-color: #1d1d1d;
background-position: 100% 50%;
background-repeat: no-repeat;
border: 0px;
width: 126px;
height: 20px;
}
ul.dropdown *.multimedia {
background-color: #1d1d1d;
background-position: 100% 50%;
background-repeat: no-repeat;
border: 0px;
width: 125px;
height: 20px;
}
ul.dropdown *.cottbus li:hover {
background-color: #414141;
color: #000;
border-width: 1px;
border-color: #FFF;
}
ul.dropdown *.sport li:hover {
background-color: #414141;
color: #000;
border-width: 1px;
border-color: #FFF;
}
ul.dropdown *.freizeit li:hover {
background-color: #414141;
color: #000;
border-width: 1px;
border-color: #FFF;
}
ul.dropdown *.kultur li:hover {
background-color: #414141;
color: #000;
border-width: 1px;
border-color: #FFF;
}
ul.dropdown *.bildung li:hover {
background-color: #414141;
color: #000;
border-width: 1px;
border-color: #FFF;
}
ul.dropdown *.multimedia li:hover {
background-color: #414141;
color: #000;
border-width: 1px;
border-color: #FFF;
}
ul.dropdown *.cottbus li {
border-style: solid;
border-width: 1px 1px 1px 1px;
background-color: ;
}
ul.dropdown *.sport li {
border-style: solid;
border-width: 1px 1px 1px 1px;
background-color: ;
}
ul.dropdown *.freizeit li {
border-style: solid;
border-width: 1px 1px 1px 1px;
background-color: ;
}
ul.dropdown *.kultur li {
border-style: solid;
border-width: 1px 1px 1px 1px;
background-color: ;
}
ul.dropdown *.bildung li {
border-style: solid;
border-width: 1px 1px 1px 1px;
background-color: ;
}
ul.dropdown *.multimedia li {
border-style: solid;
border-width: 1px 1px 1px 1px;
background-color: ;
}
