[erledigt] falsche Darstellung der Navigation im IE

Hi,

ich möchte gern auf meiner HP eine zusätzliche Navigation auf der linken Seite.

Im firefox (version 3.0) und Seamonkey wird sie richtig dargestellt, nur beim Internetexplorer (habe IE7) ist die Navigation oben mittig.

Jetzt habe ich schon einiges versucht, komme aber nicht weiter. Die Position lässt sich irgendwie nicht ändern.

Wer hat einen Tip?

Viele Grüße

Daniela

Hier der Code:

<div id="Testdesign3">
<div id="Header_oben"></div>
<div align="center"><style type="text/css"

<div align="center">

<style type="text/css">
<!--

body
{
font-family: Arial;
font-size: 14px;
overflow: auto;
padding: 10px;
margin: 0px;
}

ul, li
{
list-style-type: none;
padding: 0px;
margin: 0px;
}

li a
{
padding-right: 0px;
padding-top: 1px;
padding-bottom:10px;
}

div.menu
{
position: absolute;
z-index: 3;
top:145px;
left: 50%;
margin-left: -355px;
width: 910px;
font-family: Century Gothic;

}

.menu li
{
width: 113px;
float: left;
}

.menu a
{
border: 0px solid #000000;
background-color: #525252;
background-image: url(URL);
text-decoration: none;
text-align: center;
font-weight: normal;
cursor: pointer;
margin: 1px;
display: block;
height: 35px;
color: #FAFAD2;
font-size:15px;
}

.menu a:hover
{
background-color: #666666;
background-image: url(URL);
}

#smenu1, #smenu2, #smenu3, #smenu4, #smenu5
{
font-size: 18px;
display: none;
width: auto;
float: center;
}

#smenu1 a, #smenu2 a, #smenu3 a, #smenu4 a, #smenu5 a, #smenu6 a
{
font-weight: normal;
padding-top: 5px;
border-top: 0px;
cursor: pointer;
color: #FAFAD2;

}
//-->

</style>

<script type="text/javascript">
<!--
function montre(id)
{
with (document)

if (getElementById)
getElementById(id).style.display = 'block';
else if (all)
all[id].style.display = 'block';
else
layers[id].display = 'block';
}

function cache(id)
{
with (document)

if (getElementById)
getElementById(id).style.display = 'none';
else if (all)
all[id].style.display = 'none';
else
layers[id].display = 'none';
}
//-->
</script>

<div class="menu">
<li><a href=" http://www.danielabaer.de/Home.htm"> Home</a> </li>

<li>
<a href="http://www.danielabaer.de/Das-Buch.htm" onmouseover="montre('smenu1');" onmouseout="cache('smenu1');">
Das Buch</a>
<ul id="smenu1" onmouseover="montre('smenu1');" onmouseout="cache('smenu1');">
<li><a href="http://www.danielabaer.de/Das-Buch.htm">Bärenkind</a></li>
<li><a href=" http://www.danielabaer.de/Leseprobe.htm">Leseprobe</a></li>

<li><a href=" http://www.danielabaer.de/Die-Entstehung.htm ">Die Entstehung</a></li>
</ul>
</li>

<li>
<a href="http://www.danielabaer.de/-Ue-ber-die-Autorin.htm" onmouseover="montre('smenu3');" onmouseout="cache('smenu3');">
Über die Autorin</a>
<ul id="smenu3" onmouseover="montre('smenu3');" onmouseout="cache('smenu3');">
<li><a href="http://www.danielabaer.de/-Ue-ber-die-Autorin.htm">That's me</a></li>
<li><a href="http://www.danielabaer.de/Aktuelles.htm">Aktuelles</a></li>
<li><a href=" http://www.danielabaer.de/Bilder/index.htm">Galerie</a></li>
<li><a href=" http://www.danielabaer.de/Gedankengut.htm ">Gedankengut</a></li>
<li><a href=" http://www.danielabaer.de/Kontakt-s-Feedback.htm">Kontakt Feedback</a></li>
<li><a href=" http://www.danielabaer.de/Danke.htm">Danke</a></li>

</ul>
</li>

<li><a href="http://www.danielabaer.de/Kindesmisshandlung.htm" onmouseover="montre('smenu2');" onmouseout="cache('smenu2');">
Gegen Kindes- misshandlung</a>
<ul id="smenu2" onmouseover="montre('smenu2');" onmouseout="cache('smenu2');">

<li><a href=" http://www.danielabaer.de/Hilfe.htm ">Helfen Sie!</a></li>
<li><a href=" http://www.danielabaer.de/Definition.htm">Definition</a></li>
<li><a href=" http://www.danielabaer.de/Gesetz.htm ">Gesetz</a></li>

</ul>
</li>


<li>
<a href="http://www.danielabaer.de/Die-Stiftung.htm" onmouseover="montre('smenu6');" onmouseout="cache('smenu6');">
Die Stiftung</a>



<li>
<a href="http://www.danielabaer.de/Presse-Rezensionen.htm" onmouseover="montre('smenu5');" onmouseout="cache('smenu5');">
Presse Rezensionen</a>
<ul id="smenu5" onmouseover="montre('smenu5');" onmouseout="cache('smenu5');">

<li><a href=" http://www.danielabaer.de/Presse.htm">Presse</a></li>

<li><a href=" http://www.danielabaer.de/Rezensionen.htm ">Rezensionen</a></li>
</ul>
</li>

<li>
<a href="http://www.danielabaer.de/Links.htm" onmouseover="montre('smenu4');" onmouseout="cache('smenu4');">
Links</a>
<ul id="smenu4" onmouseover="montre('smenu4');" onmouseout="cache('smenu4');">

<li><a href=" http://www.danielabaer.de/Hilfreiches.htm">Hilfreiches</a></li>

<li><a href=" http://www.danielabaer.de/Trauma-und-Folgen.htm">Trauma und Folgen</a></li>

<li><a href=" http://www.danielabaer.de/Autoren.htm ">Autoren</a></li>

<li><a href=" http://www.danielabaer.de/Diverses.htm ">Diverses</a></li>

<li><a href=" http://www.danielabaer.de/Links.htm">Verlinkung</a></li>
</ul>
</li>


<li><a href=" http://www.guestbook-free.com/books3/orsaminore/index.php">Gästebuch</a> </li>

</div>

<style type="text/css">
<!--
table.rb_neu{position:absolute;left:1040px;top:212px;}
-->
</style>


<table class="rb_neu" width="140" border="0" cellspacing="0" cellpadding="0" id="table1">

<tr>
<td background="http://www.images-box.com/uploads/caa9d2561c.gif" height="600" class="edit_rb_footer">
</td>
</tr>
</table>

<div id="feld_links">
<ul id="navi">
<li>
<a href="http://Home.htm" id="akt">Home</a>
</li>
<li>
<a href="http://Seite1.htm">Test</a>
</li>
<li>
<a href="http://Seite2.htm">Test</a>
</li>
<li>
<a href="http://Seite3.htm">Test</a>
</li>
<li>
<a href="http://Seite4.htm">Test</a>
</li>
<li>
<a href="http://Seite5.htm">Test</a>
</li>
<li>
<a href="http://G.ae.stebuch.htm">Test</a>
</li>
<li><a href="http://Kontakt.htm">Test</a>
</li>
</ul>
</div>


----------------

div#menu{visibility: hidden;}
li.nav_element{display: none;}
li.nav_element a{display: none;}
h1#title{display: none;}
h2#title span {display: none;}
div.header{display: none;}
body {background-color:#666666;}

* { padding: 0; margin: 0; }

#Testdesign3 {
margin: 0 auto;
width: 1200px;}

#Header_oben {
color: #000000;
width: 880px;
height: 70px;
background-image: url(http://www.images-box.com/uploads/6bb8412e9e.jpg);
background: #ffffeo;
align: center;
padding: 10px;
border: 0px solid #CCCCCC
margin: 10px 10px 0px 0px;
margin-left: 149px;}

#menu {
text-align: center;
width: 990px ;
background: #666666;
color: #FAFAD2;
padding: 10px;
border: 1px solid #CCCCCC;
margin: 0px 0px 0px 0px;}

#content {
<div id="content">bla</div>
height: 990px;
width: 820px;
background: #Ffffe0;
color: #000000
border: 7px solid #525252;
margin: 72px 0px 0px 0px;
padding: 0px;
overflow: auto;
align: center;
}


#Feld_unten {
font-family: Arial;
font-size: 14px;
width: 880px;
color: #FAFAD2;
border: 1px solid #666666;
background-color: #666666;
background-image:url();
margin: 0;"
padding: 0px;}

#counter{text-align:center;
color: #FAFAD2;}

#feld_links {
color: #000000;
border: 0px solid #07417C;
background: #666666;
margin: 0px -150px 0px 0px;
padding: 0px;
height: 320px;
width: 80px;
float: left;}

#navi {
margin: 0;
padding: 20;
width: 80px;
}

#navi ul, #navi li{
list-style-type: none;
padding-top: 2px;
font-weight: normal;
}

#navi li a {
text-decoration: none;
display: block;
width:100%;
padding: 5px;}

#navi a:link, #navi a:visited {
color: #FAFAD2;
background-color: #525252;
font-family: Century Gothic;
font-size:15px}

#navi #akt {
color: #FAFAD2;
background-color: #525252;}

#navi a:hover, #navi a:hover#akt {
color: #FFFFFF;
background-color: #CCCCCC;}

li.nav_element a{
color:#FFFFFF;
display: block;
margin: 5px;
padding-left: 10px;
text-decoration: none;
width: 120px;
height: 20px;
background-image:url();
background-color:#FDC600;
}

hat niemand eine Idee?

Kann geschlossen werden...

Update auf IE8 hat das Problem behoben.

Danke

Daniela