CSS - mise en page du tableau

La description

La propriété table-layout détermine la méthode de disposition utilisée pour le rendu d'un tableau.

Valeurs possibles

  • auto- Le tableau doit être organisé selon un algorithme de mise en page automatique. Le navigateur le fait automatiquement.

  • fixed - Le tableau doit être disposé selon la méthode de mise en page de table fixe fournie.

S'applique à

Tous les éléments avec un affichage de table ou inline-table.

Syntaxe DOM

object.style.tableLayout = "fixed";

Exemple

NOTE - Cette propriété n'est pas prise en charge par de nombreux navigateurs, ne vous fiez donc pas à cette propriété.

<html>
   <head>
      <style type = "text/css">
         table.auto {
            table-layout: auto
         }
         table.fixed {
            table-layout: fixed
         }
      </style>
   </head>
   
   <body>
      <table class = "auto" border = "1" width = "100%">
         <tr>
            <td width = "20%">1000000000000000000000000000</td>
            <td width = "40%">10000000</td>
            <td width = "40%">100</td>
         </tr>
      </table>
      <br />
      
      <table class = "fixed" border = "1" width = "100%">
         <tr>
            <td width = "20%">1000000000000000000000000000</td>
            <td width = "40%">10000000</td>
            <td width = "40%">100</td>
         </tr>
      </table>

   </body>
</html>

Cela produira le résultat suivant -