probleme compatibilité IE pour menu déroulant

Bonjour à tous,
j'essaie de réaliser un site pour un lycée en html et CSS auquel j'ai ajouté un menu déroulant horizontal en javascript.
je travaille avec dreamweaver CS3.
le problème est que les sous menus apparaissent à des positions farfelues sur la pages (10 à 15 cm plus bas que le menu maître) au lieu de s'afficher juste dessous au passage de la souris.
j'ai insérer le script dans le body, dans une balise div, dans un tableau ou encore dans un calque (pour le positionner où je voulais), le problème est toujours le même.
Sous firefox, ça marche nickel quelque soit le contenant du menu.
auparavant, j'avais essayé les widgets spry inclus dans dreamweaver : là encore impeccable avec firefox et n'importe quoi avec IE6 ou 7.
j'ai essayé plusieurs menus trouvés sur ce site, même souci.
ça me désole d'arriver à avoir le rendu que je souhaite avec firefox et pas avec IE.

alors qu'est-ce que je fais mal

vous pouvez trouver la page (éducorée) sur laquelle je travaille ici

merci de votre aide.

Merci pour ta réponse, je vais essayer ce que tu proposes.
néanmoins si tu peux me proposer d'autres menus du même style mais moins capricieux qui fonctionnent sans problème sous IE et Firefox, je suis preneur.
j'en ai déjà essayé beaucoup et je ne suis pas attaché plus que cela à celui de mon site; j'ai surtout du mal à comprendre pourquoi les rendus sont différents entre les navigateurs.
merci encore.

je viens de faire les modifications, cela fonctionne nickel.
merci encore.