Puis-je utiliser une min-height pour table, tr ou td?

Question

Je tente de montrer quelques détails d'une réception dans un tableau.

Je veux que ce tableau ait une hauteur minimale pour afficher les produits. Ainsi, s'il n'y a qu'un seul produit, le tableau aurait au moins un peu d'espace vide à la fin. En revanche, s'il y a 5 produits ou plus, il n'aura pas cet espace vide.

J'ai essayé ce CSS :

table, td, tr{
  min-height:300px;
}

Mais cela ne fonctionne pas.

Answer 1

Les tables et les cellules de tableau n'utilisent pas la propriété min-height, en définissant leur height sera la hauteur minimale car les tables s'étendront si le contenu les étire.

Answer 2

Définir la hauteur sur les cellules de tableau ne fonctionne correctement que si votre td n'utilise pas box-sizing: border-box. Avec border-box, la hauteur restera celle que vous avez définie et le contenu débordera. Utilisez content-box ou quelque chose d'autre. J'ai rencontré ce problème car j'ai utilisé un réinitialiseur CSS.

Answer 3

Il suffit d'utiliser l'entrée css de min-height pour l'une des cellules de votre ligne de tableau. Fonctionne également sur les anciens navigateurs.

.rowNumberColumn {
    background-color: #e6e6e6;
    min-height: 22;
}

            1
            411978430-Intime:Ruby:Petit