smepal: Navigation mit display

Beitrag lesen

Ich habe eine Navigation nach folgendem Vorbild gemacht:
http://de.selfhtml.org/css/layouts/navigationsleisten.htm#modern

Leider funktioniert sie nur im FF korrekt und im IE erscheinen die Untermenüs nicht!

Wer kann helfen???? Verzweifle langsam!!!!

Meine CSS:

.white-header {  
background-color:#336699;  
border-bottom:1px solid #000000;  
border-top:2px solid #000000;  
color:#000000;  
font-family:Freestyle Script;  
font-size:24px;  
font-weight:bold;  
padding:4px;  
}  
body {  
}  
a {  
color:black;  
text-decoration:none;  
}  
a:hover {  
color:white;  
text-decoration:none;  
}  
a.side:hover {  
color:#000000;  
}  
a.white:hover {  
color:#DDDDDD;  
text-decoration:none;  
}  
body {  
background-color:#CCCCCC;  
font-family:Arial;  
font-size:12px;  
}  
form {  
margin:0;  
}  
hr {  
border:1px solid black;  
height:1px;  
width:75%;  
}  
hr.side-hr {  
border:1px solid #000000;  
height:1px;  
}  
td {  
font-family:Arial;  
font-size:14px;  
}  
pre {  
font-family:Arial;  
font-size:11px;  
}  
.alt {  
color:#005599;  
}  
rand ganz außen-- > .outer-border {  
}  
.sub-header {  
border-bottom:1px solid #000000;  
border-top:1px solid #000000;  
color:#000000;  
font-family:Arial;  
font-size:10px;  
padding:5px;  
}  
.full-header {  
background-color:#444444;  
color:#DDDDDD;  
font-family:Verdana,Arial,Helvetica,sans-serif;  
font-size:10px;  
padding:0;  
}  
.footer {  
background-color:#99CC33;  
border:1px solid #CCCCCC;  
color:#555555;  
font-family:Verdana,Arial,Helvetica,sans-serif;  
font-size:10px;  
padding:5px;  
}  
.button {  
background-color:#FFFFFF;  
border:1px solid #CCCCCC;  
color:#555555;  
font-family:Verdana,Arial,Helvetica,sans-serif;  
font-size:10px;  
height:20px;  
margin-top:2px;  
}  
.textbox {  
background-color:#F8F8F8;  
border:1px solid #CCCCCC;  
color:#555555;  
font-family:Verdana,Arial,Helvetica,sans-serif;  
font-size:10px;  
}  
.main-body {  
color:#555555;  
font-size:14px;  
padding:4px 0 5px;  
}  
.side-body {  
background-color:#336699;  
color:white;  
margin-left:10px;  
margin-right:10px;  
padding-left:7px;  
padding-right:7px;  
}  
.main-bg {  
color:#555555;  
padding:10px 5px;  
}  
.border {  
}  
.side-border-left {  
background-color:#336699;  
color:#777777;  
}  
.side-border-right {  
background-color:#336699;  
color:#777777;  
}  
.news-footer {  
background-color:#F1F1F1;  
color:#555555;  
font-size:10px;  
padding:3px 4px 4px;  
}  
.capmain {  
background-color:#CCCCCC;  
color:black;  
font-family:Verdana,Arial,Helvetica,sans-serif;  
font-size:14px;  
font-weight:bold;  
padding:2px 0 4px;  
}  
.scapmain {  
background-color:#336699;  
color:#000000;  
font-family:Arial;  
font-size:14px;  
font-weight:bold;  
padding:4px;  
text-align:center;  
}  
.tbl-border {  
background-color:#E1E1E1;  
color:#555555;  
}  
.tbl {  
background-color:#FFFFFF;  
color:#555555;  
font-size:11px;  
padding:4px;  
}  
.tbl1 {  
background-color:#FFFFFF;  
color:#555555;  
font-size:11px;  
padding:4px;  
}  
.tbl2 {  
background-color:#F1F1F1;  
color:#555555;  
font-size:11px;  
padding:4px;  
}  
.forum-caption {  
background-color:#F1F1F1;  
color:#888888;  
font-size:11px;  
font-weight:bold;  
padding:2px 4px 4px;  
}  
.quote {  
background-color:#F8F8F8;  
border:1px solid #BBBBBB;  
color:#555555;  
font-size:11px;  
margin:0 20px;  
padding:4px;  
}  
.poll {  
border:1px solid #BBBBBB;  
height:12px;  
}  
.comment-name {  
color:#005599;  
font-weight:bold;  
}  
.shoutboxname {  
color:#005599;  
font-weight:bold;  
}  
.shoutbox {  
color:black;  
display:block;  
}  
.shoutboxdate {  
color:black;  
font-size:10px;  
}  
.small {  
font-size:12px;  
font-weight:normal;  
}  
.small2 {  
color:#555555;  
font-size:12px;  
font-weight:normal;  
}  
.side-small {  
color:#555555;  
font-size:10px;  
font-weight:normal;  
}  
.side-label {  
color:#555555;  
padding:2px 2px 3px;  
}  
#aktiv {  
background:#3366ff;  
font-variant:small-caps;  
font-weight:bold;  
}  
#aktiv_sub span{  
background:#3366cc;  
font-variant:small-caps;  
font-weight:bold;  
display: block;  
text-align: center;  
border-left: none;  
}  
table.awec_calendar th {  
font-weight:normal;  
}  
table.awec_calendar td.current {  
border:1px solid yellow;  
}  
table.awec_calendar td.content {  
background-color:red;  
}  
table.awec_calendar td.empty {  
background-color:gray;  
}  
table.awec_calendar td.weekend {  
background-color:blue;  
}  
table.awec_list tr.odd {  
background-color:green;  
}  
table.awec_list tr.even {  
background-color:red;  
}  
table.awec_list tr.current {  
background-color:yellow;  
}  
ul#Navigation {  
margin-left: -5px;  
}  
ul#Navigation li {  
background-color:#336699;  
border-color:#99CC33;  
border-style:solid;  
border-width:0 0 1px 15px;  
list-style-image:none;  
list-style-position:outside;  
list-style-type:none;  
margin-left:-35px;  
float: none;  
position: relative;  
}  
ul#Navigation li ul {  
position: absolute;  
display:none;  
}  
ul#Navigation li:hover {  
border-color:orange;  
}  
ul#Navigation li:hover ul {  
background-color:#336699;  
border:2px solid white;  
display:block;  
position:absolute;  
width:100px;  
}  
ul#Navigation li ul li {  
display:block;  
float:none;  
font-family:freestyle script;  
list-style-type:none;  
}  
ul#Navigation li a {  
color:white;  
display:block;  
font-family:freestyle script;  
font-size:24px;  
padding:4px 2px 2px 15px;  
}  
ul#Navigation li a:hover {  
display:block;  
font-weight:bold;  
height:100%;  
padding:4px 2px 2px 15px;  
text-decoration:none;  
}  
ul#Navigation li ul li a {  
border:medium none;  
color:white;  
}  
ul#Navigation li h3 {  
border:medium none;  
}  
ul#Navigation li ul li {  
border:medium none;  
}  
ul#Navigation li ul li:hover {  
border-bottom:1px solid orange;  
}  
ul#Navigation li ul li a:hover {  
font-weight:bold;  
text-decoration:none;  
}  
* html ul#Navigation li {  
margin-left: 0px;  
}  
:first-child + html ul#Navigation li {  
}  
* html ul#Navigation li ul {  
}  
:first-child + html ul#Navigation ul {  
background-color:silver;  
padding-bottom:0.4em;  
}  
* html ul#Navigation a, * html ul#Navigation span {  
}  
ul#Navigation a {  
    display: block;  
}

der quellcode der Seite:

  
<ul id='Navigation'><li><a href="index.php?menu=Aktionen">Aktionen</a></li>  
<li><a href="viewpage.php?page_id=10&menu=Über uns">Über uns</a>  
<ul>  
<li><a href="viewpage.php?page_id=9&menu=Über uns&sub=Leiterrunde">Leiterrunde</a></li>  
<li><a href="viewpage.php?page_id=1&menu=Über uns&sub=Vorstand">Vorstand</a></li>  
<li><a href="articles.php?menu=Über uns&sub=Chronik">Chronik</a></li>  
<li><a href="viewpage.php?page_id=16&menu=Über uns&sub=Presse">Presse</a></li>  
</ul>  
</li>  
<li><a href="viewpage.php?page_id=8&menu=Kälbchen">Kälbchen</a></li>  
<li><a href="infusions/slooz_expose/index.php?menu=Bildergallerie">Bildergallerie</a></li>  
<li><a href="contact.php?menu=Kontakt">Kontakt</a>  
<ul>  
<li><a href="weblinks.php?menu=Kontakt&sub=Links">Links</a></li>  
<li><a href="anfrage.php?menu=Kontakt&sub=Verleih">Verleih</a>  
</li>  
</ul>  
</li>  
<li><a href="infusions/guest_book/guest_book.php?menu=Gästebuch">Gästebuch</a></li></ul>