Comment mettre en place une largeur fixe pour les <td> ?

Un schéma simple :

  <tr class="something">
    <td>A</td>
    <td>B</td>
    <td>C</td>
    <td>D</td>
  </tr>

J'ai besoin de mettre en place une largeur fixe pour les <td>. J'ai essayé :

tr.something {
  td {
    width: 90px;
  }
}

Et aussi

td.something {
  width: 90px;
}

pour

<td class="something">B</td>

Et même

<td style="width: 90px;">B</td>

Mais la largeur de <td> est toujours la même.

Si vous utilisez <table class="table"> sur votre tableau, la classe de table de Bootstrap ajoute une largeur de 100 % au tableau. Vous devez changer la largeur en auto.

En outre, si la première ligne de votre tableau est une ligne d'en-tête, vous devrez peut-être ajouter la largeur à th plutôt qu'à td.

Commentaires (1)

Ok, je viens de comprendre où était le problème - dans Bootstrap est mis en place comme une valeur par défaut width pour select élément, donc, la solution est :

tr. something {
  td {
    select {
      width: 90px;
    }
  }
}

Toute autre solution ne me convient pas.

Commentaires (0)

Difficile de juger sans le contexte de la page html ou le reste de votre CSS. Il peut y avoir un million de raisons pour lesquelles votre règle CSS n'affecte pas l'élément td.

Avez-vous essayé des sélecteurs CSS plus spécifiques tels que

tr.somethingontrlevel td.something {
  width: 90px;
}

Ceci afin d'éviter que votre CSS ne soit remplacé par une règle plus spécifique du css bootstrap.

(au fait, dans votre exemple de css en ligne avec l'attribut style, vous avez mal orthographié width - cela pourrait expliquer pourquoi cet essai a échoué).

Commentaires (0)