CSS/Problème avec texte justifié

Résolu/Fermé
alexou1984 Messages postés 375 Date d'inscription mardi 13 mai 2008 Statut Membre Dernière intervention 15 février 2010 - 22 déc. 2008 à 13:43
alexou1984 Messages postés 375 Date d'inscription mardi 13 mai 2008 Statut Membre Dernière intervention 15 février 2010 - 23 déc. 2008 à 17:47
Bonjour,

Voilà, j'ai un DIV dans lequel se trouve du texte, le DIV a une largeur définie avec une marge interne définie également et le texte a la valeur justifié. Sous IE le texte va correctement à la ligne en respectant la marge interne du DIV. Sous FireFox le texte semble être justifié oui mais ce dernier ne respecte pas la marge interne. Du coup le texte du côté droit se retrouve sous une marge "photo" en JPEG placée avec un SPAN (c'est une marge que j'ai créé sous Photoshop). Comment faire ?

Le code HTML :

<body>
<div class="text">
<span class="title">
<center>
BIENVENUE
</center>
</span>
<br>
blablabla
<br><br>
blablabla
<br><br>
blablabla
<br><br>
blablabla
<br><br>
blablabla
</div>

Le code CSS :

.text {position:absolute;top:35px;left:35px;width:500px;height:498px;padding:10px;font-size:15px;font-family:Georgia;text-align:justify} <---"Code source du DIV"

3 réponses

Marco la baraque Messages postés 996 Date d'inscription vendredi 9 mai 2008 Statut Contributeur Dernière intervention 5 novembre 2009 329
22 déc. 2008 à 16:59
Bonsoir alexou1984,
Selon moi si tu sors ton texte du flux, c'est normal qu'il ne respecte pas les marges de ton div.
Le fait de définir sa position en "absolute" fait que tu dois le positionner "totalement à la main", que tu ne peux plus utiliser les autres éléments de ta page pour t'aider à le positionner.

Es-tu absolument obligé de le positionner en absolute ?

Cordialement,
0
alexou1984 Messages postés 375 Date d'inscription mardi 13 mai 2008 Statut Membre Dernière intervention 15 février 2010 35
23 déc. 2008 à 00:33
J'ai essayé cette petite modif mais rien à faire ça ne marche toujours pas :

Code HTML :

<body>
<div class="div"> <---"J'ai remplacé TEXT par DIV afin de créer un nouveau code de style dans ma feuille."
<span class="title">
<center>
blablabla
</center>
</span>
<br>
<span class="text"> <---"J'ai rajouté un SPAN avec la class TEXT pour englober le texte et le séparer du DIV."
Bonjour :)
<br><br>
blablabla
<br><br>
blablabla
<br><br>
blablabla
<br><br>
blablabla
</span>
</div>

Code CSS :

.div {position:absolute;top:35px;left:35px;width:500px;height:498px;padding:10px;text-align:justify}
.text {font-size:15px;font-family:Georgia;width:480px;height:478px}

Je vais devenir fou !!!
0
Marco la baraque Messages postés 996 Date d'inscription vendredi 9 mai 2008 Statut Contributeur Dernière intervention 5 novembre 2009 329
23 déc. 2008 à 11:25
Bonjour,
Euh, pour mon post précédent j'ai parlé un peu vite en fait, même en absolute ça devrait marcher, vu que c'est ton div que tu passes en absolute (le conteneur du texte).

Mais en fait, avec ta toute première version, je n'ai aucun problème ni sous ie, ni sous firefox (le padding de ton div est bien respecté sous les 2 navigateurs).

Cordialement,
0
alexou1984 Messages postés 375 Date d'inscription mardi 13 mai 2008 Statut Membre Dernière intervention 15 février 2010 35
23 déc. 2008 à 17:47
Alors est-il possible que les dimensions sou IE et FF ne soient pas exactement identiques ? Parce que comme je te l'ai dit par-dessus le DIV se trouve une marge en JPEG que j'ai placé avec un SPAN en absolute de manière à masquer le bord du DIV. Sous IE, le texte retourne à la ligne avant d'atteindre la marge, sous FF le texte fini sous la marge avant de retourner à la ligne, je ne sais pas si tu vois ce que je veux dire !? Si je ne peux rien faire, y a t-il un moyen de faire en sorte que l'utilisateur soit redirigé vers une URL précise en fonction de son navigateur ? Ou y a t-il un moyen d'appeler une feuille de style différente en fonction du navigateur de l'utilisateur ?
0