Bonjour bonjour =D

De nombreuses fois, je me suis posée la même question : est-il possible de centrer dans une division ? Parce que comme vous le voyez sur l'aperçu d'image juste au-dessous, mon texte en en haut.... Et le code valign="center" ne marche que dans les tableaux apparemment :

Bah , ajoute un margin-top ca donneras le meme effet ^^ ou bien un
<br>

Oui, mais le souci c'est que la hauteur de l'écriture n'est pas toujours la même.... Je veux dire que des fois il y aura une ligne, des fois deux.... Et du coup, si je mets des sauts de ligne ou des marges, ça ne sera plus aligné =]

Essaye avec :

Code:

vertical-align:middle;

A la place du valign .

Ça ne marche pas nan plus =S

EDIT : Quelqu'un aurait-il une idée ? =S

Ca ne marche pas \o/ J'ai cherché partout, même dans des bouquins très sérieux, et on peut pas ToT Enfin, pas facilement quand on est feignasse (comme moi)

*ouvre son bouquin* Attention excès de zèle spotted :

Raphaël Goetter, dans 'CSS2 Pratique du design Web', a écrit:

Centrage vertical des conteneurs

L'alignement vertical des blocs reprend les différentes astuces présentées pour la première dimension (en excluant la technique du line-height, réservée aux éléments en ligne). Coupler la propriété vertical-align à l'instuction display:table-cell fonctionne en théorie... mais boque sur Internet Explorer, navigateur le plus répandu.

Le plus pratique est donc d'adapter la dernière méthode étudiée : associer un positionnement absolu à des marges négatives. Pour un paragraphe de hauteur 50px, on appliquera ainsi top:50% puis margin-top:-25px;

[...]

Dans le cadre spécifique d'un centrage vertical, soyons tout à fait honnête : en raison du manque de conformité d'Internet Explorer, les méthodes de centrage vertical en CSS se révèlent complexes et délicates. La solution la plus robuste et souvent la plus accessible demeur la classique cellule de tableau, dont le centrage vertical pourra alors être appliqué à l'aide de la propriété vertical-align, même sur Internet Explorer !

(Et si vous trouvez que c'est incomplet, faites comme moi : achetez le bouquin :b)

C'est bon a savoir ca .

Citation :

(Et si vous trouvez que c'est incomplet, faites comme moi : achetez le bouquin :b)

Han , la pub .

Mais il est bien le bouquin, je l'aime, c'est ma bible du CSS (et seulement 16€, on a vu pire @o@)

Moi j'ai pris ceux de Mathieu Nebra , 25 euros mais bon ils valent leurs prix ^^

Je rappel qu'on est pas là pour faire de la pub!!

Hiro' a écrit:

Moi j'ai pris ceux de Mathieu Nebra , 25 euros mais bon ils valent leurs prix ^^

Je les ai aussi ! \o/

Teal > C'est pas de la pub, c'est de l'échange d'astuces entre codeurs. Non ? *Fuit très loin*

Lostmindy a écrit:

Hiro' a écrit:

Moi j'ai pris ceux de Mathieu Nebra , 25 euros mais bon ils valent leurs prix ^^

Je les ai aussi ! \o/

Teal > C'est pas de la pub, c'est de l'échange d'astuces entre codeurs. Non ? *Fuit très loin*

Echange ou pas, vous avez pris l'initiative d'aider cette personnes donc continuez, si vous voulez vous échangez quelque trucks faîtes le par MP s'il vous plaît.

Merci de votre aide, j'ai réussi =) J'aurais une question : à quoi sert display:table-cell ?

C'est une propriété qui sert à transformer un élément en cellule de tableau '_'

En fait, la propriété css display permet de transformer les élements inline en blocs et vice versa, avec la valeur :
block : pour transformer en bloc (comme les div, les paragraphes, etc...)
inline : pour transformer en élément en ligne (comme les a, les span, etc..)
none : pour cacher l'élément
table-cell : pour transformer en cellule de tableau
inline-block : pour transformer en bloc (avec la largeur, la hauteur, etc) mais positionné dans le flux (inline). Très pratique cette propriété d'ailleurs ♥



Mon bouquin m'indique par ailleurs que même si on transforme un élément inline en bloc, la règle en HTML reste la même : On ne met jamais de bloc dans un élément inline (jamais de div dans un span, entre autres...), transformés ou pas.

Ah, je ne connaissais pas table-cell ^^ Merci des indications =D

Est-ce que tu as résolu ton problème ou tu veux plus d'explications ?

Il est résolu =) Désolée, j'ai oublié de le mentionner ^^' Mais j'ai mis le petit icône

Merci beaucoup pour vos explications =p

Ok Je classe