Salve ho il seguente script che mostra e nasconde dei <div>. Tuttavia il risultato è diverso tra IE e Firefox. Il risultato che vorrei ottenere è quello che mi appare correttamente su IE, ossia di avere i div affiancati, però su Firefox i primi elementi vanno a sovrapporsi ai secondi.

Non sono molto esperto dei CSS , ma ho provato qualche tentativo, però con scarsi risultati. Il problema è sul componente float:left Dove sbaglio?


Il codice è il seguente:

Codice PHP:

<HTML><HEAD>

<
SCRIPT type=text/javascript>
var 
stato= new Array();
var 
num_elementi=3;

if (
document.getElementById){
document.write('<style type="text/css">')
document.write('.switch{display:none;}')
document.write('</style>')
}

function 
modifica(elem){
    if (
stato[elem]=="block"stato[elem]="none";
    else 
stato[elem]="block";
    
document.getElementById('sc'+elem).style.display=stato[elem];
}
function 
modifica_all(num){
   for(
i=1;i<=num_elementi;i++){
   
stato[i]="none";
    if (
num==0stato[i]="block";   
     
modifica(i);
   }
}

</SCRIPT>




<META content="Microsoft FrontPage 5.0" name=GENERATOR></HEAD>
<BODY>
<DIV>[url="#"]Contract All[/url] | [url="#"]Expand All[/url]</DIV>




<DIV style="float:left; width:50; height: 21">
<table border="1" cellpadding="0" cellspacing="0" style="border-collapse: collapse" bordercolor="#111111" width="100%" id="AutoNumber3">
  <tr>
    <td width="33%"></td>
    <td width="33%"></td>
    <td width="34%"></td>
  </tr>
  <tr>
    <td width="33%"></td>
    <td width="33%">A</td>
    <td width="34%"></td>
  </tr>
  <tr>
    <td width="33%"></td>
    <td width="33%"></td>
    <td width="34%"></td>
  </tr>
</table>
</DIV>

<DIV style="float:left; width:50; height: 21" class=switch id=sc1 >
<table border="1" cellpadding="0" cellspacing="0" style="border-collapse: collapse" bordercolor="#111111" width="300" id="AutoNumber4" bgcolor="#C0C0C0">
  <tr>
    <td width="26"></td>
    <td width="42"></td>
    <td width="12"></td>
  </tr>
  <tr>
    <td width="26"></td>
    <td width="42">aaaaaa</td>
    <td width="12"></td>
  </tr>
  <tr>
    <td width="26"></td>
    <td width="42"></td>
    <td width="12"></td>
  </tr>
</table>
</DIV>


<DIV style="float:left; width:50; height: 21">
<table border="1" cellpadding="0" cellspacing="0" style="border-collapse: collapse" bordercolor="#111111" width="100%" id="AutoNumber3">
  <tr>
    <td width="33%"></td>
    <td width="33%"></td>
    <td width="34%"></td>
  </tr>
  <tr>
    <td width="33%"></td>
    <td width="33%">B</td>
    <td width="34%"></td>
  </tr>
  <tr>
    <td width="33%"></td>
    <td width="33%"></td>
    <td width="34%"></td>
  </tr>
</table>
</DIV>

<DIV style="float:left; width:50; height: 21" class=switch id=sc2 >
<table border="1" cellpadding="0" cellspacing="0" style="border-collapse: collapse" bordercolor="#111111" width="300" id="AutoNumber4" bgcolor="#00FF00">
  <tr>
    <td width="33%"></td>
    <td width="33%"></td>
    <td width="34%"></td>
  </tr>
  <tr>
    <td width="33%"></td>
    <td width="33%">bbb</td>
    <td width="34%"></td>
  </tr>
  <tr>
    <td width="33%"></td>
    <td width="33%"></td>
    <td width="34%"></td>
  </tr>
</table>
</DIV>

</BODY></HTML>