5568 sujets

Sémantique web et HTML

Bonjour,
J'ai défini un tableau de façon classique avec une entête (head) et un corps (body) dans lequel l'entête est la fusion de 2 cellules :
<table id="montableau">
<thead>
<tr><th colspan='2'>titre</th></tr></thead>
<tbody><tr><td>élément1.0</td><td>élément2.0</td></tr>
        <tr><td>élément1.1</td><td>élément2.1</td></tr>
        <tr><td>élément1.2</td><td>élément2.2</td></tr>
           ....etc
</tbody></table>

Les cellules qui sont sous l'entête (donc dans le body) ne sont pas fusionnées.
Je voudrais que la première colonne de cellule représente 20% de la largeur du tableau, j'ai donc ajouté une ligne de CSS :
#montableau tr td:first-child{ width:20%;}

Et cela ne fonctionne pas, les cellules du corps prennent la moitié de l'entête.

Est-il possible de faire ceci en CSS ou alors faut-il tout faire en HTML5 ?
Salut,

D'abord, le recours à un tableau est-il justifié ?

Ensuite, si la réponse à la première question est oui, sache qu'il est tout à fait possible de définir les dimensions d'un tableau en CSS.

Enfin, en ce qui concerne ton problème, essaie d'abord de simplifier ton sélecteur (il est inutile de préciser tr) et, si ça ne marche toujours pas, essaie d'ajouter deux éléments HTML col au début de ton tableau et d'appliquer ton width: 20% au premier élément col.
@ Victor, oui le recours à un tableau est justifié, il représente un log, avec dans la première colonne, l'heure et dans la seuxième, l'événement du log.
En effet, en supprimant le tr qui est inutile, cela fonctionne.
Merci !
@Raphaël.
Pour le table-layout, j'avais une règle
table {table-layout : fixed}
et avec cette règle commune à tous les tableaux, le problème se posait malgré tout.

Merci de votre aide, je crois que désormais cela fonctionne sur toutes les pages.