Vertikal-Menü: schweben Pausen im IE [geschlossen]

Question

http://www.thelisthq.net/datetest.php

Wenn Sie die Seite in Firefox, Chrome zu sehen, oder dh 8 mit Kompatibilitätsmodus aus dem vertikalen Menü funktioniert einwandfrei. Meine Taktik war es, das ganze Menü auf der rechten Seite und kehren Sie die Kugeln (Kugeln auf der rechten Seite) zu schweben. Wenn Sie es in früheren Versionen von IE-Ansicht bricht es. Ich kann nicht glauben, wie dieses Problem zu beheben, habe ich versucht, verschiedene doctypes, und viele kleine Verbesserungen, aber kippen scheint es zu bekommen richtig zu arbeiten. Wer weiß, ob ein Update oder über Einsicht hat?

Answer 1

Ich reparierte es mit diesem CSS. Sie können eine clearfix auf #sidenav ul:

#sidenav ul{
    /* removed: float:right; */
    padding:0;
    white-space:nowrap;
    /* removed: direction:rtl; */
}
#sidenav li{
    font-size: 16px;
    font-family:"Times New Roman", Times, serif;
    list-style-type:none;
    width:220px;
    background: #2a3940;
    color: #FFF;
    padding-top: 3px;
    padding-bottom: 3px;
    margin-bottom: 15px;
    text-align:center;
    /* removed: direction: ltr; */
    /* added: */
    float: right;
}

Answer 2

Es tut uns Ihren Code nicht sehen, aber ich versuchte, schnell meine eigene Rolle auf das, was ich auf der Seite sehen konnte.

Arbeiten auf IE6, IE7, Firefox (nicht über Chrome zu testen)

. Hinweis: Kens Antwort ist wahrscheinlich die Lösung für Sie

#menu {
    width: 200px;
}
#menu ul {
    list-style: none; 
    padding: 0;
    margin: 0;
    overflow: hidden;
 }
 #menu ul li {
    margin: 5px 0;
    float: right;
}
#menu ul li a {
    display: block;
    background: #000;
    color: #fff;
    text-decoration: none;
    padding: 4px;
    width: 150px;
    text-align: center;
}
#menu ul li a:hover { width: 200px; }

und Mark-up:

<div id="menu">
    <ul>
        <li><a href="#">Menu Item</a></li>
        <li><a href="#">Menu Item</a></li>
        <li><a href="#">Menu Item</a></li>
        <li><a href="#">Menu Item</a></li>
        <li><a href="#">Menu Item</a></li>
    </ul>
</div>