CSS dropdown werkt niet onder IE 6

[anoniem]

Hoi Ik ben bezig met een dropdown menu voor mijn website en het menu werkt perfect op firefox en IE 7.0, maar voor lagere versies werkt de dropdown niet. De website is: [URL]www.vvmonnickendam.nl[/URL] Hieronder staat de CSS van het menu: [code:1:e7823c2fa7] #topmenu{ padding: 10px; margin: 0px; font-family: arial, helvetica, sans-serif; white-space:nowrap; background-image: url(gras.jpg); } #topmenu td{ text-align:center; background-image: url(Graswit.jpg); border-width: 3px; border-style: solid; border-color: #215D21; width: 130px; position: relative; } #topmenu td a{ display: block; text-decoration: none; color:#215D21; font-weight:bold; font-size:12px; } #topmenu td a:hover { background:#004300; color:#FFFFFF; font-weight:bold; } #topmenu ul { /* alle lists */ padding: 0; margin: 0; list-style: none; align: left; position: absolute; left: left; } #topmenu td { /* alle list items */ float: left; position: relative; width: 130px; } #topmenu td ul { /* sub items */ display: none; position: absolute; top: 1em; left: 0; background-image: url(Graswit.jpg); } #topmenu td ul { /* postitie resetten voor alle browsers behalve IE */ top: auto; left: auto; } #topmenu td:hover ul, td.over ul { /* lists nested onder hovered list items */ display: block; border-width: 3px; border-style: solid; border-color: #215D21; background-image: url(Graswit.jpg); position: absolute; left: 0px; padding: 4px; width: 105px; } #content { clear: left; } [/code:1:e7823c2fa7] Hier staat de html van het menu: [code:1:e7823c2fa7] <table id="topmenu"><tr> <td><a href="">Zaterdag</a> <ul> <li><a href="construction.php">Zaterdag 1</a></li> <li><a href="construction.php">Zaterdag 2</a></li> </ul> </td> <td><a href="construction.php">Zondag</a> <ul> <li><a href="construction.php">zondag 1</a></li> <li><a href="construction.php">Zondag 2</a></li> <li><a href="construction.php">zondag 3</a></li> </ul> </td> <td><a href="construction.php">A junioren</a> <ul> <li><a href="construction.php">A1</a></li> <li><a href="construction.php">A2</a></li> </ul> </td> <td><a href="">B junioren</a> <ul> <li><a href="construction.php">B1</a></li> <li><a href="construction.php">B2</a></li> </ul> </td> <td><a href="">C junioren</a> <ul> </ul> </td> <td><a href="">D junioren</a> <ul> </ul> </td> <td><a href="">E pupillen</a> <ul> </ul> </td> <td><a href="">F pupillen</a> <ul> </ul> </td> <td><a href="">Dames</a> <ul> </ul> </td> <td><a href="">Meiden</a> <ul> </ul> </td> <tr></table>[/code:1:e7823c2fa7] Hier staat het javascript: [code:1:e7823c2fa7]<script type="text/javascript"> startList = function() { if(document.all && document.getElementById) { topmenuRoot = document.getElementById("topmenu"); for (i=0; i<navRoot.childNodes.length; i++) { node = topmenuRoot.childNodes[i]; if (node.nodeName=="td") { node.onmouseover=function() { this.className+=" over"; } node.onmouseout=function() { this.className=this.className.replace(" over", ""); } } } } } window.onload=startList; </script>[/code:1:e7823c2fa7] Ik hoop dat jullie weten wat hier mis is en me kunnen helpen het op te lossen.

[anoniem]

In FF2 werkt het ook niet goed wanneer het menu uit twee regels bestaat en het dropdown menu over een onderstaand item zou moeten vallen.

[anoniem]

Jup dat weet ik. dat is een kwestie van het aanpassen van de layout. het gaat mij erom dat hij een dropdown weergeeft bij IE6

[anoniem]

Ik snap niet helemaal waarom je hier een table gebruikt, in elk dropdowntutorial gebruikt men - terecht - slechts een pure list. Het makkelijkst is om te werken zoals in een goed tutorial wordt uitgelegd, zoals in de 'son of suckerfish dropdowns'.

[anoniem]

Ik krijg het jammer genoeg niet voor elkaar om dezelfde layout met een list te maken :(