Раскрывающееся меню смещается вправо в IE7

Question

Я знаю, что на это, вероятно, уже был дан ответ, но я не могу легко найти его среди многочисленных других жалоб на совместимость IE7 с выпадающими меню. По сути, я прошел учебник, чтобы сделать основное выпадающее меню. Прекрасно работает в других браузерах, кроме IE7. Вместо пунктов меню, опускающихся прямо под вкладкой, я получаю что-то вроде этого:

Веб-изображение http://akasuna.com/00000/Twentyten_ie7_bug.jpg

Конечно, это не та веб-страница, над которой я работаю, но на самом деле ее нет в Интернете, и эта картина представляет ту же проблему, что и я.

CSS:

@charset "utf-8";

#main{
    width: 730px;
    margin-left: auto;
    margin-right: auto;
}

#regList{
    list-style-image:url(expbul1a.gif);
    font-family:"Palatino Linotype", "Book Antiqua", Palatino, serif;
}

#navMenu{
    margin:0;
    padding:0;
}

#navMenu ul{
    margin:0;
    padding:0;
}

#navMenu li{
    margin:0;
    padding:0;
    list-style:none;
    float:left;
    position:relative;
}

#navMenu ul li a{
}

#navMenu ul ul{
    position:absolute;
    visibility:hidden;
    top:50px;
}

#navMenu ul li:hover ul{
    visibility:visible;
}

/**********************************************************/

#navMenu li:hover{
}

#navMenu ul li:hover ul li a:hover{
}

#navMenu a:hover{
}

.clearFloat{
    clear:both;
    margin:0;
    padding:0;
}

HTML:

<div id="navMenu">

    <ul>
        <li><a href="SBartletHomepageHTML.html"><img src="home_cmp_expeditn010_hbtn.gif"/></a></li><!--home header-->
    </ul>

    <ul>
        <li><a hrer=""><img src="Books.htm_cmp_expeditn010_hbtn.gif"/></a>
            <ul>
                <li><a href="Normality is Not Mental Health.htm"><img src="Images/Normality is not Mental Health.gif"/></a></li>
                <li><a href="Conceptual Therapy.html"><img src="conceptual therapy.htm_cmp_expeditn010_hbtn.gif"/></a></li>
                <li><a href="Reflexivity.html"><img src="reflexivity.htm_cmp_expeditn010_hbtn.gif"/></a></li>
                <li><a href="Human Pathology.html"><img src="human pathology.htm_cmp_expeditn010_hbtn.gif"/></a></li>
                <li><a href="Critique.html"><img src="Critique of Normality.htm_cmp_expeditn010_hbtn.gif"/></a></li>
                <li><a href="Logic.html"><img src="Logic.htm_cmp_expeditn010_hbtn.gif"/></a></li>
                <li><a href="When You Dont Know.html"><img src="When You Don't Know Where to Turn.htm_cmp_expeditn010_hbtn.gif"/></a></li>
            </ul>

        </li>
    </ul>

    <ul>
        <li><a hrer=""><img src="PSYCHOLOGY.htm_cmp_expeditn010_hbtn.gif"/></a>
            <ul>
                <li><a href="PsychEd.html"><img src="PsychEd.htm_cmp_expeditn010_hbtn.gif"/></a></li>
                <li><a href="Animal Rights.html"><img src="Animal Rights.htm_cmp_expeditn010_hbtn.gif"/></a></li>
                <li><a href="Effectiveness.html"><img src="Effectiveness.htm_cmp_expeditn010_hbtn.gif"/></a></li>
                <li><a href="Limitations.html"><img src="Limitations.htm_cmp_expeditn010_hbtn.gif"/></a></li>
            </ul>
        </li>
    </ul>

    <ul>
        <li><a hrer=""><img src="PHILOSOPHY.htm_cmp_expeditn010_hbtn.gif"/></a>
            <ul>
                <li><a href="Metalogic.html"><img src="MoR.htm_cmp_expeditn010_hbtn.gif"/></a></li>
            </ul>
        </li>
    </ul>

    <ul>
        <li><a hrer=""><img src="LITERARY.htm_cmp_expeditn010_hbtn.gif"/></a>
            <ul>
                <li><a href="Sapphos Journal.html"><img src="Sappho's Journal.htm_cmp_expeditn010_hbtn.gif"/></a></li>
                <li><a href="Christs Journal.html"><img src="Christ's Journal.htm_cmp_expeditn010_hbtn.gif"/></a></li>
                <li><a href="Voices.html"><img src="Voices.htm_cmp_expeditn010_hbtn.gif"/></a></li>
            </ul>
        </li>
    </ul>

Answer 1

Убедитесь, что при каждом использовании position:absolute вы предоставляете и top и left (или bottom и right).Иначе браузеры догадаются, а они страшные гадатели.Например, в вашем случае я заметил, что #navMenu ul ul не имеет значения left.