JS DOM objets et le style d'attributs

Question

J'ai deux ensembles de code:

var holder = document.createElement('div'); 

var a = document.createElement('div'); 
a.style.float = 'left'; 
a.style.width = '90px'; 
a.style.height = '90%'; 
a.style.border = '1px dotted black'; 

var b = document.createElement('div'); 
b.style.float = 'left'; 
b.style.width = '90px'; 
b.style.height = '90%'; 
b.style.border = '1px dotted black'; 

holder.appendChild(a); 
holder.appendChild(b); 

Et:

var holder = document.createElement('div'); 

var a = document.createElement('div'); 
a.setAttribute('style', 'float:left; width:90px; height: 90%; border: 1px dotted black;'); 

var b = document.createElement('div'); 
b.setAttribute('style', 'float:left; width:250px; height: 90%; border: 1px dotted black;'); 

holder.appendChild(a); 
holder.appendChild(b); 

Le premier exemple ne fonctionne pas correctement - 'b' se trouve en contrebas 'a' .

Le deuxième exemple fonctionne bien - 'b' se trouve à droite de 'a'.

Pourquoi?

Answer 1

Cela est inexact:

b.style.float ... 

il devrait être

b.style.cssFloat ... // non-ie 
b.style.styleFloat ... // ie 

il est sûr de définir les propriétés pour tous les navigateurs; aucun ne va briser la fonction de l'autre