menu verschiebt sich im ie
flips
- css
Hallo,
Irgendwie finde ich den Fehler im unteren Menü nicht. Chrome Opera und FF geht alles wunderbar nur eben mal wieder nicht im IE. Das Problem besteht darin das beim IE die einzelnen Punkte des Menu verschoben werden (nach unten/nach rechts/oder verschwinden je nach IE Version) und nicht in der festen horizintalen Ebene stehen bleiben.
Währe nett wenn mir Blindfisch einer helfen kann.
#footer{
float:left;
width:100%;
position: relative;
height:60px;
overflow:hidden;
text-align: left;
}
ul.menu{
list-style-type: none;
text-transform: uppercase;
margin: 0 0 0 -38px;
font-size: 0.8em;
display: inline;
width: 100%;
}
* html ul.menu {
margin :0;
}
ul.menu ul {
list-style-type: none;
width:100%;
}
ul.menu a {
display: block;
padding: 3px 10px 3px 10px;
font-weight:bold;
width: auto;
}
ul.menu ul a {
padding: 0 10px;
}
ul.menu li {
padding:0;
margin:0;
float:left;
}
ul.menu ul {
margin:0;
padding:0;
position:absolute;
display:none;
width:100%;
}
* html ul.menu ul {
position:relative;
}
ul.menu ul.hover, ul.menu li.hover ul, ul.menu li:hover ul {
display:block;
border-left: solid 1px #999;
border-bottom: solid 1px #999;
margin: -8px 0 0 0;
padding: 8px 0 10px 0;
background: url(images/navline.gif) no-repeat top left;
text-decoration: none;
text-transform: none;
}
ul.menu ul li {
float:left;
width: auto;
}
ul.submenu {
text-transform: none;
}
<div id="footer">
<ul class="menu">
<li onmouseover="show(this)" onmouseout="hide(this)" >
<a href="navi.html#2">Tagesfahrten</a>
<ul class="submenu">
<li onmouseover="show(this)" onmouseout="hide(this)" > </li>
<li><a href="navi.html#Bundesgartenschau">Bundesgartenschau</a></li>
<li><a href="#Marzipanstad">Marzipanstadt Lübeck</a></li>
<li><a href="#Hagenbeck">Hagenbecks Tierpark</a></li>
<li><a href="#Rabsblütenfest">Rabsblütenfest</a></li>
</ul>
</li>
<li onmouseover="show(this)" onmouseout="hide(this)" >
<a href="#">Vorschau</a>
<ul class="submenu">
<li onmouseover="show(this)" onmouseout="hide(this)" > </li>
<li><a href="#Christkindlemarkt">Christkindlemarkt</a> </li>
<li><a href="#Land">Altes Land</a></li>
<li><a href="#Apfel">Apfel Ernte</a></li>
</ul>
</li>
<li onmouseover="show(this)" onmouseout="hide(this)" >
<a href="#">Kurzreisen</a>
<ul class="submenu">
<li onmouseover="show(this)" onmouseout="hide(this)" > </li>
<li><a href="#Spreewald">Spreewald</a></li>
</ul>
</li>
</ul>
</div>
<script type="text/javascript">
//<![CDATA[
function show(element){
element.className += "hover";
}
function hide(element){
element.className = element.className = "";
}
//]]>
</script>
mfg und vielen Dank