LI UL erscheint n.i.o. in IE5x, 6x

[wannabe]

Hallo zusammen,

Ich habe einen Navigations Leiste erstellt komplett aus CSS und LI/UL's.
Durch FF und IE7 erscheint es ok.
Jetzt, unser liebe IE5x und 6x gibt mir einen Alptraum.
Der Sinn da drin ist wie bei JS, Mann hat Scrolldown Menus um Platz zu sparren.

Hier ist den Link für d. Website: http://www.chicas-del-fuego.de/Beta

Nach viele Recherche, habe ich Code gefunden und einbearbeite so das es passt.

Erstmal, hier ist d. CSS teil:

div#Rahmen {
width: 900px;
height: 20px;
padding: 0px;
border: 0px solid #5B5B5B;
background-color: clear;
text-align: center;
}
  * html div#Rahmen {  /* Corrections for IE 5.x */
width: 900px;
w\idth: 900px;
}
  div#Rahmen div {
background: clear;
text-align: center;
/* Corrections for IE 5.x */ width: 900px; w\idth: 100%;
}
  ul#Navigation {
margin: 0;
padding: 0;
text-align: center;
}
  * html ul#Navigation {/* Corrections for IE 5 and 6 */
width: 900px;
w\idth: 900px;
}
  ul#Navigation li {
list-style: none;
float: left;
/* NEW -> */width: 180px;
position: relative;
margin: 0px;
padding: 0px;
}
  * html ul#Navigation li {  /* Corrections for IE 5 and 6 */
margin-bottom: -5px;
width: 180px;
}
  *:first-child+html ul#Navigation li {  /* Corrections for IE 7 */
margin-bottom: 0px;
}
  ul#Navigation li ul {
margin: 0;
padding: 0;
position: absolute;
top: 1px;
left: 0px;
}
  * html ul#Navigation li ul {  /* Corrections for IE 5.x */
left: 0px; lef\t: 0px; width: 180px;
}
  ul#Navigation li ul li {
float: none;
display: block;
margin-bottom: 1px;
background-image: url(Images/smoke-bg.jpg)
}
  ul#Navigation a, ul#Navigation span {
display: block;
padding: 1px 1px;
text-decoration: none;
font-weight: bold;
border: 1px solid #5B5B5B;
border-left-color: #BBBBBB;
border-top-color: #BBBBBB;
color: black;
background-image: url(Images/smoke-bg.jpg);
}
  * html ul#Navigation a, * html ul#Navigation span {  /* Nesseccary only for IE */
width: 100%; w\idth: 6em;
}
  ul#Navigation a:hover, ul#Navigation span, li a#aktuell {
border-color: #BBBBBB;
border-left-color: #5B5B5B;
border-top-color: #5B5B5B;
color: #F7DE0A;
background-image: url(Images/smoke-bg-H.jpg);
}
  li a#aktuell {  /* aktuelle Rubrik kennzeichnen */
color: #E7002A;
background-color: clear;
}
  ul#Navigation li ul span {  /* Actual 2nd level highlights */
background-color: #E7002A;
}
  ul#Navigation li>ul {
display: none;
top: 1.8em;
}
  ul#Navigation li:hover>ul, ul#Navigation li>a#aktuell+ul {
display: block; /* Corrections for IE 5.x */ width: 180px;
}
   Workaround for IE 7
  *:first-child+html ul#Navigation ul {
background-color:clear;
padding-bottom:0px;
}

Ich werde mich freuen wenn jamand mich auf'm richtigen Pfad zeigen kann.
Bis jetzt, interessiere ich mich mit CSS und sein Fähigkeiten.
Ich habe auch gelesen dass bei IE5x und 6x, muss Mann Breit in Prozent eingeben. Auch getestet.

HTML Code ist nicht anderes als paar DIVs.

<div id="Rahmen" align="center">
 <ul id="Navigation">
    <li>
     <a href="bla.html"><font color="#F7DE0A">bla</font>
     </a>
    </li>
    <li>
     <a href="bla-2.html">bla-2
        </a>
    </li>
    <li>
     <a href="bla-3.html">bla-3
     </a>
    </li>
    <li>
 <a href="bla-4.html">bla-4
        </a>
 <ul>
          <li>
            <a href="bla-4b.html">bla-4b
            </a>
          </li>
        </ul>
    </li>
  </ul>
  <div></div>
</div>

greets

Mark