Discussion :

[loukoum82]

Je voudrais pouvoir paramétrer dynamiquement la largeur des colonnes d'un tableau html.
pour cela j'utilise tout simplement la propriété style.width de l'objet cell (TD) comme ceci :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
 
 var td = table.rows[0].cells[3]; // (colonne 4 de la ligne 1)
 td.style.width = "115px";

Mais lorsque je regarde ensuite la valeur du offsetWidth de mon objet cell j'obtiens 126 ???

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
 
 var td = table.rows[0].cells[3]; // (colonne 4 de la ligne 1)
 alert(td.offsetWidth);

Une idée du pourquoi du comment??

[SpaceFrog]

le contenu force la cellule à s'elargir?

[loukoum82]

Non il y a pratiquement rien dedans...
Pour plus de précisions le tableau a cette tete :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
+-----------------------------------------+
|                 entete                  |
+------+------+------+-------+------------+
|  col1|col2  | col3 |  col4 |  col5      |
+------+------+------+-------+------------+

(je suis nul en dessin ascii désolé)
bref, en gros la cellule entete est une cellule avec un colSpan de 5 et un width non précisé,
et toutes les autres je les ai forcée à style.width=115px et pourtant tout leur offsetWidth est à 126 !?

[SpaceFrog]

soit tu as mis un width au table ou les colonnes ont du contenu qui force la largeur.

le offsetWidth est la largeur effective

[Bovino]

Il faut aussi prendre en compte les marges et les bordures

[loukoum82]

cellpadding et cellspacing sont à 0...
Je veux bien prendre 1px pour chaque bordure, mais de là a passer de 115 à 126, c'est quand même énorme. Et puis le width de la table n'es pas renseigné.
Je ne comprends pas.

[loukoum82]

Oups, désolé, ma réponse est trouvée grâce à l'onglet "Apparence" de FireBug, il s'agit bien de l'addition du (padding de 5)x2 + une bordure de 1px...
Désolé du dérangement.