28172 sujets

CSS et mise en forme, CSS3

Bonjour,

J'ai cette page ci: http://paste2.org/p/359799

Dans ma cellule du milieur une image et texte. Si je met un float: left sur mon image:

- la cellule du tableau ne s'étire plus au contenu
- le texte n'est plus centré verticalement

upload/5911-exemple.png

Comment faire?

Je ne peux pas mettre cela en forme avec un "sous tableau" car il hérite les styles du tableau parent et ça m'embête dans mon projet.

Merci.
Modifié par lox (05 Aug 2009 - 15:21)
Salut ,

Pourquoi mettre ton image en float ?

juste :
<td><img src="mon_image.png" alt="" />Et mon texte</td>


sa fonctionne.

Pour aligner le texte verticalement j'utilise la propriété css line-height qui à la même valeur que la hauteur de la cellule, mais pour une table sa devrait le faire tout seul.
Pour centrer verticalement une image : vertical-align:middle toujours en css.
Modifié par bentsen (05 Aug 2009 - 16:27)
La cellule du milieu a une largeur, qui est calculée indépendamment de la largeur de l'image flottante.
En entourant le texte de la cellule du milieu par <div style="padding-left:50px"> </div>, comme on le fait par exemple pour une présentation en colonnes, ça marche.
Bonjour,

bentsen a écrit :
Pourquoi mettre ton image en float ?


Parce qu'en fait, mon texte peut être sur plusieurs lignes

Lolololo a écrit :
En entourant le texte de la cellule du milieu par <div style="padding-left:50px"> </div>, comme on le fait par exemple pour une présentation en colonnes, ça marche.


Comment n'y avais je pas pensé.... Merci.
Par contre le texte perd son alignement vertical dans la cellule.
Modifié par lox (05 Aug 2009 - 23:57)