hauteur de cellule

13 août 2007, 11:53

Bonjour tout le monde,

je travaille dans un tableau pour lequel je détermine la hauteur d'une ligne et de la cellule qui cmpose cette ligne.

Voici le code pour ca :

Code : Tout sélectionner

<tr style="height: 260px;">
        <td width="350px" style="height: 260px;" valign="top">

Ensuite, dans cette cellule j'affiche du contenu en php (jusque là, rien de bien compliqué) seulement, lorsque mon contenu dépasse la hauteur de ma cellule, celle ci s'aggrandit automatiquement. Comment faire pour quelle reste à une hauteur fixe et que ce soit le texte (et contenu) qui soit tronqué ?

13 août 2007, 12:02

Bonjour, utilise la propriété CSS overflow en lui mettant la valeur hidden. Par exemple :

Code : Tout sélectionner

<table style="background-color: #f3f3f3">
	<tr>
		<td style="width: 350px; vertical-align: top">
			<div style="height: 260px; overflow: hidden">
			test test test test test test test test test test test test test test 
test test test test test test test test test test test test test test test test test test 
test test test test test test test test test test test test test test test test test test 
test test test test test test test test test test test test test test test test test test 
test test test test test test test test test test test test test test test test test test 
test test test test test test test test test test test test test test test test test test 
test test test test test test test test test test test test test test test test test test 
test test test test test test test test test test test test test test test test test test 
test test test test test test test test test test test test test test test test test test 
test test test test test test test test test test test test test test test test test test
test test test test test test test test test test test test test test test test test test 
test test test test test test test test test test test test test test test test test test 
test test test test test test test test test test test test test test test test test test 
test test test test test test test test test test test test test test test test test test 
test test test test test test test test test test test test test test test test test test 
test test test test test test test test test test test test test test test test test test 
test test test test test test test test test test test test test test test test test test 
test test test test test test test test test test test test test test test test test test 
test test test test test test test test test test test test test test test test test test 
test test test test test test test test test test test test test test test test test test 
test test test test test test test test test test test test test test test test test test 
test test test test test test test test test test test test test test test test test test 
test test test test test test test test test test test test test test test test test test 
test test test test test test test test test test test test test test test test test test 
test test test test test test test test test test test test test test test test test test 
test test test test test test test test test test test test test test test test
			</div>
		</td>
	</tr>
</table>

13 août 2007, 12:03

plutot utiliser une balise <div> plutot que de mettre les propriétés dans ma balise <td> car j'avais essayé avec overflow mais dans ma balise <td> et ca ne marchait pas.

13 août 2007, 12:06

Et donc problème réglé ? Car j'ai testé en local (sous firefox), et chez moi aucun soucis.

13 août 2007, 12:16

oui oui problème réglé. Mais pourquoi cela ne marche pas quand je mets le style dans ma balise td ? et pourquoi cela fonctionne avec la balise div ?

Sinon aucun probleme, sous IE7, IE6, et firefox.

13 août 2007, 14:42

C'est parce que pour un tableau, l'attribut height est en fait interprété comme un min-height d'après les spécifications du w3c.. du coup s'il y a plus de texte, la hauteur augmente. Ce n'est pas le cas du div qui est un élément de type block et pour qui la propriété height correspond à la hauteur réel de l'élément.

Ceci dit, tu dois malgré tout pouvoir y parvenir sous firefox en fixant la propriété display de ta cellule à block :

Code : Tout sélectionner

td {display:block;height:260px;overflow:hidden;}

Mais cela va casser la structure de ton tableau et ne fonctionnera pas sous IE

Bref, le div reste la solution à utiliser

hauteur de cellule

Qui est en ligne