Attribut table-layout CSS

Définition et utilisation

L'attribut tableLayout est utilisé pour afficher les règles d'algorithme de l'alignement des cellules, des lignes et des colonnes du tableau.

Fixed table layout :

Compared to automatic table layout, fixed table layout allows the browser to layout the table faster.

Dans la mise en page fixe du tableau, la mise en page horizontale dépend uniquement de la largeur du tableau, de la largeur des colonnes, de la largeur des bordures du tableau et de l'intervalle des cellules, et n'a rien à voir avec le contenu des cellules.

En utilisant la mise en page fixe du tableau, l'agent utilisateur peut afficher le tableau après avoir reçu la première ligne.

Mise en page automatique du tableau :

Dans la mise en page automatique du tableau, la largeur des colonnes est déterminée par le contenu le plus large sans saut de ligne dans la cellule de colonne.

Cet algorithme peut être plus lent, car il doit accéder à tout le contenu du tableau avant de déterminer la mise en page finale.

Description

Cette propriété spécifie l'algorithme utilisé pour terminer la mise en page du tableau. L'algorithme de mise en page fixe est plus rapide mais moins flexible, tandis que l'algorithme automatique est plus lent mais reflète mieux le tableau HTML traditionnel.

Voir également :

Tutoriel CSS :Tableau CSS

Manuel de référence HTML DOM :Attribut tableLayout

Exemples

Définir l'algorithme de mise en page du tableau :

table
  {
  table-layout:fixed;
  }

Essayez-le vous-même

Syntaxe CSS

table-layout: auto|fixed|initial|inherit;

Valeur de l'attribut

Valeur Description
automatic Par défaut. La largeur des colonnes est déterminée par le contenu des cellules.
fixed La largeur des colonnes est déterminée par la largeur du tableau et la largeur des colonnes.
inherit Définit que la valeur de l'attribut table-layout doit être héritée de l'élément parent.

Détails techniques

Valeur par défaut : auto
Héritabilité : yes
Version : CSS2
Syntaxe JavaScript : object.style.tableLayout="fixed"

Plus d'exemples

Configurer la mise en page du tableau
Cet exemple montre comment configurer la mise en page du tableau.

Prise en charge du navigateur

Les nombres dans le tableau indiquent la première version du navigateur qui prend en charge cette propriété.

Chrome IE / Edge Firefox Safari Opera
14.0 5.0 1.0 1.0 7.0