Centrage texte dans Div

[crealex]

Bonjour,
je sais que ce type de questions a été maintes et maintes fois abordé mais je galère !
Je voudrais centrer verticalement mon texte dans mon div mais il apparaît toujours en haut de celui-ci.
Voilà mon code :

<div align="center" class="Style2" id="apDiv1">
          <p>mon texte</p>
          </div>

Dans les fonctions class="Style2" & id="apDiv1"> contiennent toutes les données nécessaires afin de centrer mon texte verticalement.

Merci pour votre aide :wink:

 

[guismo]

bonjour,
c'est par là qu'il va falloir regarder http://www.w3.org/TR/REC-CSS1/#vertical-align
ca correspond au valign du html
plus concret en francais : http://www.zonecss.fr/style_css/feuille_css_vertical_align.html
bonne journée

 

[u94082]

bonjour,
c'est par là qu'il va falloir regarder http://www.w3.org/TR/REC-CSS1/#vertical-align
ca correspond au valign du html
plus concret en francais : http://www.zonecss.fr/style_css/feuille_css_vertical_align.html
bonne journée

Oui sauf que c'est pas super "propre". Le valign est en principe à réserver aux images. Pour le texte c'est la propriété line-height.

 

[crealex]

bonjour,
c'est par là qu'il va falloir regarder http://www.w3.org/TR/REC-CSS1/#vertical-align
ca correspond au valign du html
plus concret en francais : http://www.zonecss.fr/style_css/feuille_css_vertical_align.html
bonne journée

J'ai beau essayer guismo, ça ne marche pas

 

[crealex]

bonjour,
c'est par là qu'il va falloir regarder http://www.w3.org/TR/REC-CSS1/#vertical-align
ca correspond au valign du html
plus concret en francais : http://www.zonecss.fr/style_css/feuille_css_vertical_align.html
bonne journée

Oui sauf que c'est pas super "propre". Le valign est en principe à réserver aux images. Pour le texte c'est la propriété line-height.

Merci pour ton aide antinomx, mais depuis que je fais des tests, sous Dream c'est parfait, et sous safari ou firefox, le texte est toujours placé en haut de mon div. J'ai beau essayer la propriété line-height dans tous les sens et cela ne me donne pas le texte centré dans mon div, je ne peux uniquement jouer sur l'interlignage.

 

[detectimmobilier]

J'espère que tu rafraîchis bien ton cache (touche F5) après chaque mofif sur FF
Excuse moi c'est tout c** mais parfois on a la tête dans le guidon :wink:

 

[crealex]

J'espère que tu rafraîchis bien ton cache (touche F5) après chaque mofif sur FF
Excuse moi c'est tout c** mais parfois on a la tête dans le guidon :wink:

Suis sous mac & à priori je rafraîchis bien mon cache mais rien n'y fait, j'ai toujours le même résultat.



Je sais que c'est trop demandé et si vous ne voulez pas je comprendrais, mais ne serait t'-il pas possible que j'envoie la page en question à l'un de vous afin qu'il regarde d'où vient le problème ?

 

[OTP]

crealex : merci d'éviter les titres en MAJ.

 

[crealex]

crealex : merci d'éviter les titres en MAJ.

Ok pas de soucis :wink: , j'éviterais pour les prochaines fois

 

[u94082]

Admettons que ton div fait 100px de hauteur, donc height = 100px; alors line-height doit être égale à 100px. Mais attention il faut juste une seule ligne de texte, sinon il faut passer par padding ou autre vu que l'interligne sera de 100px.
Le plus simple serait de mettre un lien vers la page en question.

 

[SpeedAirMan]

Il faut donner à ta div conteneur une hauteur fixe, et placer l'élément qui se trouve à l'intérieur au milieu via margin (par exemple).

Une petite recherche sur centrer verticalement en css donne de bons résultats.


Edit : la méthode de line-height est tirée par les cheveux, et pas vraiment sémantiquement correcte :-/

 

[crealex]

Admettons que ton div fait 100px de hauteur, donc height = 100px; alors line-height doit être égale à 100px. Mais attention il faut juste une seule ligne de texte, sinon il faut passer par padding ou autre vu que l'interligne sera de 100px.
Le plus simple serait de mettre un lien vers la page en question.

Veuillez trouver ci-joint le lien de la page web :
http://www.maitresandraburger.fr/pages/tarifs.html

Merci pour votre aide
:wink:

 

[guismo]

et as tu essayé par hasard <td valign="middle"> pour le td qui contient ton div
ca me parait trop simple pour que ce soit ca, et on passerait du ccs au html, mais bon, je tente
excuses moi de ne pas pouvoir te donner la solution, car je suis au moins aussi mauvais que toi en css (pour ne pas dire certainement bien pire :mrgreen: )

 

[crealex]

et as tu essayé par hasard <td valign="middle"> pour le td qui contient ton div
ca me parait trop simple pour que ce soit ca, et on passerait du ccs au html, mais bon, je tente
excuses moi de ne pas pouvoir te donner la solution, car je suis au moins aussi mauvais que toi en css (pour ne pas dire certainement bien pire :mrgreen: )

Toujours en recherche mais merci quand même Guismo, :wink:

J'ai vraiment besoin d'aide :cry:

 

[psykoko]

Roo !
Ton div, il faut choisir !
Tu as ça aujourd'hui :

<div align="center" class="Style2" id="apDiv1">

Tu appliques un id, et une classe
C'est pas top.
Fait ça :

<div class="Style2">

avec ça dans ton css :

.Style2 {
	font-size: 13px;
	color: #663366;
	text-align: center;
	font-family: Georgia, "Times New Roman", Times, serif;
	line-height: 100%;
	vertical-align: 50%;
}

C'est mieux, non?

 

[crealex]

Roo !
Ton div, il faut choisir !
Tu as ça aujourd'hui :

<div align="center" class="Style2" id="apDiv1">

Tu appliques un id, et une classe
C'est pas top.
Fait ça :

<div class="Style2">

avec ça dans ton css :

.Style2 {
	font-size: 13px;
	color: #663366;
	text-align: center;
	font-family: Georgia, "Times New Roman", Times, serif;
	line-height: 100%;
	vertical-align: 50%;
}

C'est mieux, non?

Oui effectivement c'est mieux :wink: mais maintenant ça me génère un nouveau problème à savoir que tout est décalé

http://www.maitresandraburger.fr/pages/tarifs.html

 

[psykoko]

ben je vois pas
C'est bon comme ça... non ?

 

[detectimmobilier]

Rien n'est décalé pour moi avec FF

 

[crealex]

Rien n'est décalé pour moi avec FF

Alors là… je comprends vraiment pas ! chez moi sous Safari & FF, tout est décalé & pourtant je vide le cache !
Je suis sous mac os x, peut être que je m'y prends mal concernant la manip de vider le cache :roll: ?

 

[guismo]

personnellement, j'ai l'image avec la mention légale qui remonte et est décalée sous ie8 ...

 

[crealex]

personnellement, j'ai l'image avec la mention légale qui remonte et est décalée sous ie8 ...

Exact donc je ne rêve pas ! sous IE, safari & FF, l'image avec la mention légale est décalé & ça commençe à urger !
mon client commence à s'impatienter… j'ai vraiment besoin d'aide :|
Bref je lançe un SOS.

Merci pour votre aide

 

[Monty973]

Rajouter un height:282px; dans style2 semble résoudre le problème de décalage vertical sous Firefox.

 

[psykoko]

Ah !
J'avais pas compris
Effectivement, tes mentions remontent
La technique de monty doit fonctionner.