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==0) stato[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>

, ma ho provato qualche tentativo, però con scarsi risultati. Il problema è sul componente float:left Dove sbaglio?
Rispondi quotando