table-layout CSS propriété

Définition de la CSS table-layout.

La propriété CSS table-layout permet de spécifier l'algorithme utilisé pour disposer les cellules, colonnes et lignes d'un tableau.

Exemple de syntaxe CSS table-layout :

table-layout : auto;
table-layout : fixed;

La propriété de feuille de style table-layout CSS peut prendre la valeur de :

auto : la largeur du tableau et de ces cellules dépendent du contenu.
fixed : la largeur du tableau et des colonnes est fixé par la largeur des éléments table et col ou par la largeur de la première ligne de cellules. Les cellules dans les lignes suivantes n'ont pas d'effet sur la largeur des colonnes même si un width est spécifié.
inherit : hérite de la CSS table-layout son parent(CSS2).

Exemple de code table-layout CSS

Conditions d'application de la CSS table-layout.

La propriété de feuille de style table-layout CSS est applicable sur la balise HTML ou XHTML TABLE ou sur un élément dont la valeur display est égale 'table' ou 'inline-table'.
Si le tableau n'a pas de taille spécifié alors le calcul des tailles se fera comme si on était en table-layout : auto.

Problème d'interprétation de table-layout en Css.

La propriété de feuille de style table-layout ne devrait pas poser de problèmes.
Petite information concernant la valeur fixed : le tableau entier peut être affiché une fois que la première ligne a été chargée et analysée.

Règles de syntaxes CSS pour table-layout.

Règles de calcul des tailles de cellules en fixed

Si taille du table n'est pas spécifiée et que table-layout est fixed, le calcul se fait comme si table-layout est à auto. Les propriétés min-width et max-height des cellules de la première ligne sont prises en compte.

Si taille du table est spécifiée et que table-layout est fixed, voici comment la largeur de chaque colonne est déterminée :

Si une cellule dans la première ligne a une valeur width autre que auto, elle détermine la largeur de cette colonne. Si la cellule couvre plus d'une colonne, la largeur est divisée sur les colonnes.
Toutes les colonnes restantes se répartissent de manières égales le reste horizontal espace table (moins les bordures ou l'espacement des cellules).
Si la table est plus large que les colonnes, l'espace supplémentaire doit être réparti sur les colonnes de manière égale.

Les propriétés min-width et max-height des cellules sont ignorés.

Compatibilités navigateurs de la propriété table-layout

Détails des versions de la CSS table-layout: Propriété table-layout est compatible avec CSS1 et plus.; Propriété table-layout est compatible avec CSS2 et plus.

Résumé du support navigateurs de la CSS table-layout: Propriété CSS table-layout est compatible à partir de Chrome 14; Propriété CSS table-layout est compatible à partir de Firefox 1; Propriété CSS table-layout est compatible à partir de Internet Explorer 6; Propriété CSS table-layout est compatible à partir de Opera 7; Propriété CSS table-layout est compatible à partir de Safari 1

Equivalence de la CSS table-layout en HTML.

La propriété CSS table-layout n'a pas d'équivalence en HTML ou XHTML.

Votre avis sur la définition table-layout en CSS

Votez pour la définition CSS `table-layout`

Votes: 4.8 / 5 - 4 votes
Cliquez sur une étoile pour voter.

Définitions annexes à la Css table-layout

Définitions CSS annexes table-layout

display: La propriété CSS DISPLAY permet de modifier le type de rendu d'un élément.Exemple d'écriture CSS de display display : block; display : inline; display...[ display ]
max-height: La propriété de Hauteur CSS MAX-HEIGHT permet de spécifier la hauteur maximale de la zone de contenu d'un élément (X)HTML dit de type block. Exemple d...[ max-height ]
min-width: La propriété de Longueur CSS MIN-WIDTH permet de spécifier la longueur minimale de la zone de contenu d'un élément (X)HTML dit de type block. Exemple ...[ min-width ]
width: La propriété de Longueur CSS WIDTH permet de spécifier la longueur de la zone de contenu d'un élément (X)HTML dit de type block. Exemple d'écriture CS...[ width ]

Définitions HTML annexes table-layout

table: La balise HTML et XHTML TABLE englobe tous les éléments du tableau.<TABLE> </TABLE> Un tableau doit commencer par la balise HTML et XHTML <TABLE> et s...[ table ]