faire paraître div même dans IE6 et IE7/FF

Question

j'ai une division avec cinq divs flotteur à l'intérieur:

var div=document.createElement("div"); 
div.className="cssDivNino"; 

var divFolio=document.createElement("div"); 
divFolio.className="cssFolio"; 
div.appendChild(divFolio); 

var divCurp=document.createElement("div"); 
divCurp.className="cssCurp"; 
div.appendChild(divCurp); 

var divNombre=document.createElement("div"); 
divNombre.className="cssNombre"; 
div.appendChild(divNombre); 

var divLocalidad=document.createElement("div"); 
divLocalidad.className="cssLocalidad"; 
div.appendChild(divLocalidad); 

var divClear=document.createElement("div"); 
divClear.className="clear"; 
div.appendChild(divClear); 

divFolio.innerHTML= someData; 
divCurp.innerHTML= someData; 
divNombre.innerHTML= someData; 
divLocalidad.innerHTML= someData; 

C'est le css:

.cssDivNino {padding: 0; margin: 0} 
.cssFolio {font-family:arial; font-size:10px; color:#000000; background-color:#FFFFFF; float: left; width: 7%; margin-right: 1%; padding: 0} 
.cssCurp {font-family:arial; font-size:10px; color:#000000; background-color:#FFFFFF; float: left; width: 17%; margin-right: 1%; padding: 0} 
.cssNombre {font-family:arial; font-size:10px; color:#000000; background-color:#FFFFFF; float: left; width: 36%; margin-right: 1%; padding: 0} 
.cssLocalidad {font-family:arial; font-size:10px; color:#000000; background-color:#FFFFFF; float: left; width: 35%; margin-right: 1%; padding: 0} 
.clear { clear:both; width: 0%; height: 0; padding: 0; margin: 0; border: thin; border-color:#000000} 

C'est à quoi il ressemble dans IE7 and Firefox et au IE6. Notez l'espace supplémentaire de la div parent sous les divs enfants sur IE6.

J'ai essayé de résoudre ce problème avec javascript:

div.style.height = divFolio.style.height; 

Mais cela ne fonctionne pas.

Answer 1

Quelques notes:

1. Vous vous épargnerez beaucoup d'ennuis en utilisant simplement un <table> pour ces données, qui est sous forme de tableau.

2. Construire ce genre de choses via le DOM est incroyablement lent comparé à laisser le navigateur rendre le HTML brut. Juste quelque chose à savoir.

Quoi qu'il en soit, je immédiatement essaie de flotter le conteneur div .cssDivNino gauche et, définissant explicitement les marges supérieure et inférieure à 0, et en gardant un œil sur IE6's suite of float/margin bugs.

Answer 2

Je suis d'accord avec Tpiptych mais pour les arguments Si je voulais accomplir cela, je finirais par utiliser des feuilles de styles différents pour le navigateur de défauts (dans ce cas IE6). Sachez que vous ne pourrez peut-être pas obtenir le même aspect à 100% et que vous devrez peut-être concevoir un look légèrement différent pour IE6.

Même après que j'écrirai ceci, j'appuierais toujours la solution> table <.

HTH!

Cordialement,
Frank