tableauRésolu/Fermé

Question

Bonjour, J'affiche un tableau sur ma page. Le tableau est plus grand que l'écran, alors je définis la largeur du tableau : Là, les td sont de la même largeur, sauf sur la dernière colonne où ils sont moins large. J'ai tenté de mettre

, mais c'est pareil ....... J'ai 12 td. Merci de m'aider.

tryan44 · Answer

Salut,

Théoriquement si vos "td" n'ont pas de dimension précisé dans le html ou via css, il devrait tous faire la même longueur.

t671 · Answer

OK ! J'ai tous mes td à la même largeur.
Mais faut aussi que je joue avec le width de la table pour régler le tout, et que tout soit de la même taille.
J'ai 12 colonnes avec des td width de 120. Soit pour la table : width 1440.
Mais si je rajoute une colonne, mes derniers td de la dernière colonne ne sont plus de la même largeur. Et je dois modifier le width de la table à +120.
Y a t'il une solution autre que de modifier le width de la table ?
Merci.

arthezius · Answer

Tu n'as pas besoin de définir la largeur du tableau ET celle des colonnes.
L'un ou l'autre suffit.
Si tu défini à 120px la largeur des colonnes, enlève celle du tableau (ou l'inverse).
Le reste d'adaptera de lui même. 

Par défaut, sur les cellules, il y a un padding de 1px. Il y a également un espace entre les cellules (qu'on peut enlever avec border-collapse:collapse). Ces valeurs vont augementer la largeur réelle des colonnes.
Ainsi, tu ne peux pas réellement partir du principe que 12x120=1440 et définir également la valeur du tableau à 1440px.
Si tu ajoutes une bordure aux cellules, la largeur sera aussi modifié.
C'est pour ça qu'il faut choisir entre les deux.

tryan44 · Answer

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
  <meta content="text/html; charset=ISO-8859-1" http-equiv="content-type">
  <title>table</title>
  <style type="text/css">
table{
border:1px solid red;
}
td{
border:1px solid black;
width:100px;
}
  </style>
</head>


<body>
<table class="table">
  <tbody>
    <tr>
      <td></td>
      <td></td>
      <td></td>
      <td></td>
      <td></td>
      <td></td>
      <td></td>
      <td></td>
      <td></td>
      <td></td>
      <td></td>
      <td></td>
    </tr>
    <tr>
      <td></td>
      <td></td>
      <td></td>
      <td></td>
      <td></td>
      <td></td>
      <td></td>
      <td></td>
      <td></td>
      <td></td>
      <td></td>
      <td></td>
    </tr>
    <tr>
      <td></td>
      <td></td>
      <td></td>
      <td></td>
      <td></td>
      <td></td>
      <td></td>
      <td></td>
      <td></td>
      <td></td>
      <td></td>
      <td></td>
    </tr>
    <tr>
      <td></td>
      <td></td>
      <td></td>
      <td></td>
      <td></td>
      <td></td>
      <td></td>
      <td></td>
      <td></td>
      <td></td>
      <td></td>
      <td></td>
    </tr>
    <tr>
      <td></td>
      <td></td>
      <td></td>
      <td></td>
      <td></td>
      <td></td>
      <td></td>
      <td></td>
      <td></td>
      <td></td>
      <td></td>
      <td></td>
    </tr>
  </tbody>
</table>
</body>
</html>

t671 · Answer

OK ! Merci à tous ! ;o)

Tableau

5 réponses

Discussions similaires

Newsletters