Bonjour,

Je voudrais savoir comment fixer la largeur (et aussi la hauteur) d'un tableau, afin qu'il ne s'étire pas en fonction de son contenu.

Merci
Modifié par mathmax (28 Aug 2005 - 21:08)
Si tu utilises une feuille de style, voilà la propriété qu'il faut que tu utilises :

overflow: auto;

Je pense que pour la largeur de ton tableau tu mettras :

table
{
width: 300px;
height: 100px;
overflow: auto;
}

Le tableau sera bloqué en 300 pixel de largeur et 100 de hauteur, et si ton contenu dépasse, le navigateur ajoutera une barre de défilement sr le côté.
Si tu veux simplement couper ton texte s'il dépasse la taille fixée, alors met

overflow: hidden;

Et si tu veux faire apparaître les barres de défilment même si le texte ne dépasse pas :

overflow: scroll;
Merci.
En fait je veux appliquer cette propriété aux cellules du tableau. J'applique donc cette propriété à table ou à td?

Par contre il me semble que cette propriété ne marche pas si on défini les propriétés width et height dans le HTML. Cela m'embette car c'est ce que j'ai fais. Ca m'embettait de définir pour chaque cellule une classe afin de lui appliquer des propriétées CSS (d'autant plus que l'ai pas mal de cellules et de tailles différentes à chaque fois). Dois-je changer de méthode?
Je n'arrive même pas à l'appliquer aux tables. J'y arrive seulement pour les bloc div, p,... Voici mon code:


<table>
  <tr>
    <td>&nbsp;</td>
  </tr>
</table>



table {
width:200px; 
height:50px;
overflow:auto;
}

td {
width:200px; 
height:50px;
overflow:auto;
}


Ne sachant pas si il faut appliquer les propriétés CSS sur table ou td, j'ai mis les deux...
Euhh... Tu veux que tes cellules fassent la même largeur que ton tableau ?
Je vois pas trop l'intéret là...
Tu voulais p'tet faire un:
tr{width:200px;}

au lieu d'un :
td {width:200 px;}

Non?
En fait il n'y a qu'une cellule dans mon tableau, donc oui.
Mais je cherche surtout à pouvoir appliquer la propriété overflow à ma table (ou à ma cellule) afin qu'elle ne s'étire pas en fonction de son contenu. J'ai fais ce qu'on m'avais indiqué ci-dessus mais ça ne semble pas marcher... Une idée?

Merci d'avance!
Si tu n'as qu'une cellule, pourquoi utiliser des tableaux ?
tu te fais un div conteneur de 200px de large, et l'ensemble des div suivants en largeur 100% avec un overflow:auto.
tu bidouilles tes bordures pour que ça tombe bien, et zou.
Non?
Je prenais l'exemple d'un tableau à une cellule afin de commencer par le cas le plus simple. J'aurais après voulu faire la même chose sur des cas plus compliqués. Prenons l'exemple d'un tableau à deux cellules. Mon code serait:


<table>
<tr>
<td></td>
</tr>
<tr>
<td></td>
</tr>
</table>



table {
width:200px; 
height:100px;
overflow:hidden;
}

td {
width:200px; 
height:50px;
overflow:hidden;
}


Mon problème reste le même...
Bon donc si j'ai tout bien suivi, tu veux un tableau où:
-le tableau est de largeur fixe
-chaque colonne est de largeur fixe.(pas toutes la même largeur je présume...)

J'ai dans l'idée que le rendu va te prendre des PLOMBES, puisqu'il va être fait deux fois (rendu par défaut des tableaux, puis rendu demandé par la css...)
Je crois me rappeler qu'il existe une propriété css2 pour désactiver le rendu automatique des tableaux, et je commencerais par là à ta place (table-layout : fixed je crois..pour ie5.) Mais honnètement, je crois que chercher à fixer la largeur des cellules est résolument une mauvaise idée...
je remonte le topic car je n'arrive pas à fixer la hauteur d'un tableau, même un mettant

overflow:hidden;

simplement en voulant faire comme ceci

<table style="height:100px;overflow:hidden;">... </table>


Cela ne fonctionne pas Smiley fache