problema js con browser diversi

[ortobello]

Ragazzi ho un problema che nn riesco a risolvere e mi sta facendo uscire pazzo!!!
Ho questo codice javascript

function startmenu()
{
document.getElementById('menu1').style.display = "none";
}

function menufunc(menuId)
{
if(document.getElementById(menuId).style.display == "none")
{
startmenu();
document.getElementById(menuId).style.display = "block";
}
else
{
startmenu();
}
}


Questo script fa apparire e scomparire un menu...


<a href="javaScript:menufunc('menu1');"><table background="images/sfondo_testatina_principale.jpg" width="250" style="height:31px;" border="0" cellspacing="0" cellpadding="0" align="right">
<tr>
<td class="testo18_bianco" style="padding-left:10px;">$MenuItem;</td>
<td align="right" style="padding-right:5px;" class="testo12_rosa">
</td>
</tr>
</table></a>

Se uso questo codice mi funziona con firefox e chrome mentre

<table background="images/sfondo_testatina_principale.jpg" width="250" style="height:31px;" border="0" cellspacing="0" cellpadding="0" align="right">
<tr>
<a href="javaScript:menufunc('menu1');"> <td class="testo18_bianco" style="padding-left:10px;">$MenuItem;</td>
<td align="right" style="padding-right:5px;" class="testo12_rosa">
</td></a>
</tr>
</table>
mi funziona solo su internet explorer....
Come posso fare a risolvere questo problemo e farlo funzionare su tutti i browser???
Grazie mille

[artorius]

molto semplicemente perché non puoi mettere un elemento con display: inline, come le <a> attorno ad un elemento con display non inline, inoltre, le tabelle devono essere formattate correttamente, non puoi mettere un <a> attorno un <td>, solo un <tr> può stare attorno un <td>.

Sul motivo per cui su Firefox e Chrome va, mi spiace dirlo, è perché sono meno rigidi alle limitazioni dell'HTML, a meno che il DOCTYPE non sia STRICT, il che, IMHO, è una gran cagata, visto che per sviluppare il uso Firefox e spesso devo penare per ore per capire come mai le cose che su Firefox vanno benissimo su IE, giustamente, non funzionano.

[ortobello]

Grazie mille...
grazie a tuoi consigli sono arrivato a capire che "<a href....>" va messo direttamente sul testo
quindi:


<table background="images/sfondo_testatina_principale.jpg" width="250" style="height:31px;" border="0" cellspacing="0" cellpadding="0" align="right">
<tr>
<td class="testo18_bianco" style="padding-left:10px;">$MenuItem;</td>
<td align="right" style="padding-right:5px;" class="testo12_rosa">
</td>
</tr>
</table>

Ora funziona con tutti i browser!!!

GRAZIE