CSS-Menü. Funktioniert in allen Browsern außer IE

Question

Ich versuche, ein CSS-Menü für meine Schulwebseite zu erstellen. Ich habe meine Seite auf einem Mac entwickelt und sie funktioniert genau so, wie ich sie haben möchte. Ich habe es in Safari, Firefox und Chrome sowie Firefox auf Windows getestet, alle funktionieren gut, ich fahre mit dem Mauszeiger über das Links-Menü und es klappt herunter.

css für Menü

#menu
{
 position:relative;
 top:-83px;
 left:60%;
 font-size:30px;
 width:250px;
}

#menu ul
{
 position:absolute;
 list-style-type:none;
 background-image:url('../images/linkBG.png');
 background-repeat:no-repeat;
 background-position: 38px 0px;
 width:250px;
}

#menu li ul
{
 display:none;
 list-style-type:none;
 background-image:url('../images/menuBG.png');
 background-repeat:repeat-y;
 font-size:20px;
}

 #menu a:link {color:rgb(255,0,0);}
 #menu a:visited {color:rgb(255,255,0);}
 #menu a:hover {color:rgb(255,0,255)}
 #menu a:active {color:rgb(255,255,255);}

 #menu li:hover > ul
 {
 display: block;
 }

 #menu li ul li
 {
 padding-left:0px;
 padding-top:10px;
 padding-bottom:10px;

 }

Beim Versuch, es auf IE (ver6 und ver8) die Links Menü neu positioniert es selbst (bewegt sich nach oben über 50px und überlappt die Überschrift), das Hintergrundbild wird über auf der rechten Seite um etwa 30px verschoben, und das Menü nicht mehr nach unten fällt, wenn die Maus über den Text bewegt. Ich habe gehört, dass es schwierig ist, für den IE zu entwickeln, aber das ist einfach dumm. Ich habe eine Lösung gesehen, die ein bisschen Skript beinhaltet, um das Problem zu umgehen, aber ich kann kein Skript verwenden, da es sich um eine Aufgabe handelt (die auf einem Windows-Rechner bewertet wird, so dass die Wahrscheinlichkeit hoch ist, dass sie auf den IE trifft). Zusammen mit dem fehlerhaften Menü ist eine Tabelle, die ich zentrieren mit margin-left:auto et margin-right:auto wieder einmal funktioniert es in allen Browsern außer dem IE. Gibt es eine Möglichkeit, wie ich das umgehen kann? Gibt es eine Alternative zu hover, die in allen Browsern funktioniert.

danke.

html code für menü

<div id="menu">
    <ul>
        <li>Links Menu
            <ul>
                <li><a href="#info">Details</a></li><!--This may be #details-->
                <li><a href="#home_town_float">Home town</a></li>
                <li><a href="#course">My Course</a></li>
                <li><a href="#listdemo">Books, Music and Films</a></li>
                <li><a href="#tabledemo">Timetable</a>     </li>
                <li><a href="#formdemo">Search</a></li>
            </ul>
        </li>
    </ul>
</div>