Maison  >  Article  >  interface Web  >  Des cellules de tableau de largeur égale peuvent-elles être obtenues avec du CSS pur pour un nombre indéterminé de cellules ?

Des cellules de tableau de largeur égale peuvent-elles être obtenues avec du CSS pur pour un nombre indéterminé de cellules ?

Susan Sarandon
Susan Sarandonoriginal
2024-11-08 15:03:01430parcourir

Can Equal Width Table Cells Be Achieved with Pure CSS for an Indeterminate Number of Cells?

Cellules de tableau de largeur égale avec un nombre indéterminé de cellules

Dans un scénario où un tableau contient un nombre imprévisible d'éléments de cellules de tableau, peut du CSS pur soit utilisé pour établir des largeurs égales pour ces cellules quel que soit le contenu variable tailles ?

Réponse :

Oui, c'est possible en utilisant les déclarations CSS suivantes :

<code class="css">div {
  display: table;
  width: 250px;
  table-layout: fixed;
}

div > div {
  display: table-cell;
  width: 2%; /* or 100% if preferred */
}</code>

Cette solution introduit table-layout : fixe ;, qui, en combinaison avec une largeur spécifiée pour chaque cellule (2% dans cet exemple), déclenche un algorithme de tableau spécifique qui s'efforce de respecter les dimensions désignées. Gardez à l'esprit que Safari 6 sur OS X peut afficher des résultats différents en raison de son implémentation non standard de table-layout:fixed;.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn