Menu deroulant vertical : les sous-menus ne passent pas a droite

bonjour,

je voudrais obtenir le même résultat que le menu vertical variante du tutorial, c'est à dire des boites de sous-menu qui se positionnent sur la droite de l'élément parent du menu

j'ai commencé par copier bêtement le code; mais déception : mon sous menu apparait SOUS l'élément parent, et non à côté

j'ai pensé qu'il me suffisait de comparer les codes du menu déroulant "de base" et de la variante pour comprendre, mais je ne vois pas ce qui provoque le positionnement du sous-menu à droite

ça doit vous paraître évident, mais vraiment je ne trouve pas

j'ai fini par trouver une solution insatisfaisante en répétant à chaque niveau les propriétés de l'élement parent (menu, puis dt, puis dd, puis li), en particulier la position, mais aussi background etc...
c'est pas super logique, les propriétés devraient être héritées, mais si j'essaie de supprimer un niveau, l'affichage délire de nouveau

donc même si je trouve mon code très moche et idiot, ça donne le résultat voulu

par contre, du coup, le onmouseout qui fonctionnait avant ne fonctionne plus ?

là aussi j'ai bidouillé : tous les éléments du menu auront des li sous-menus, et comme on passe forcément sur une ligne du menu, ça enlève les autres...

pas logique que le résultat du javascript change alors que je n'ai pas modifié la feuille HTML, seulement la CSS externe ?!
pas grave, un jour je comprendrai...