Problème pour justifier un texte html
Résolu/Fermé
bugs02
Messages postés
51
Date d'inscription
mercredi 2 juillet 2008
Statut
Membre
Dernière intervention
23 février 2009
-
17 août 2008 à 07:29
Rigobert - 24 sept. 2008 à 09:10
Rigobert - 24 sept. 2008 à 09:10
A voir également:
- Justifier html
- Editeur html - Télécharger - HTML
- Html download - Télécharger - HTML
- /Var/www/html/index.html ✓ - Forum Linux / Unix
- &Nbsp html ✓ - Forum Webmastering
- [HTML] - á et les autres - Forum HTML
3 réponses
ThEBiShOp
Messages postés
8378
Date d'inscription
jeudi 22 mars 2007
Statut
Contributeur
Dernière intervention
8 février 2021
1 565
17 août 2008 à 11:22
17 août 2008 à 11:22
premièrement tu devrais centraliser tes styles en css tu aurais moins de soucis.
donc au lieu de mettre 2 balises font (d'ailleurs tu aurais pu en mettre une seule et rassembler les attributs dans une seule) tu aurais pu faire :
ensuite si tu texte n'est pas justifié c'est que tu utilises 2 règles de mise en forme contradictoire. La première va justifier ton texte, la seconde va le centrer, mais seule la dernière va être utilisée. On ne peut pas faire un mix de ce genre, c'est l'une ou l'autre.
Si tu veux faire un texte qui sera justifié et qui ne prendra pas toute la largeur de ta page il faut faire quelque chose du style :
et supprimer la balise <center>
donc au lieu de mettre 2 balises font (d'ailleurs tu aurais pu en mettre une seule et rassembler les attributs dans une seule) tu aurais pu faire :
<div style="text-align:justify; font-size: 80%; color: purple;">
ensuite si tu texte n'est pas justifié c'est que tu utilises 2 règles de mise en forme contradictoire. La première va justifier ton texte, la seconde va le centrer, mais seule la dernière va être utilisée. On ne peut pas faire un mix de ce genre, c'est l'une ou l'autre.
Si tu veux faire un texte qui sera justifié et qui ne prendra pas toute la largeur de ta page il faut faire quelque chose du style :
<div style="text-align:justify; width: 80%; margin-left: 10%; margin-right: 10%; font-size: 80%; color: purple;">
et supprimer la balise <center>
Merci à ThEbiShOp too.
Ton code m'a permis d'insérer une ligne de légende dans mes diaporamas, avec une mise en page beaucoup plus à mon goût que les classic align left rigth et center.
Mais j'arrive pas encore à ce que je souhaite:
Un texte justifié (deux lignes seulement), au centre de la page, avec des lignes de même largeur.
Bref, un texte justifié, et centré à la fois.
Explication en images:
Avec ton code (légérement modifié)
<div style= "text-align:justify; margin-left: 5%; margin-right: 5%; font-size:16px; color:#E6E4CA;" face=Verdana>Vendredi soir, pendant le concert de Groundation, des festivaliers nous ont proposé un spectacle alternatif enflammé, et vive, et vive, et vive le feu. Y'à pas à dire, ça a chauffé l'ambiance dans le public.</font></div>
Ca donne ça avec un écran 24 pouces à 1920 de résolution:
Image 1
Pas de problème, le texte est sur une ligne, facile à centrer:
Mais dès que je passe à une résolution inférieure en largeur (en basculant mon écran en vertical), soit 1200 "seulement", voilà ce que ça donne:
image 2
J'ai essayé avec des marges plus larges:
( margin-left: 13%; margin-right: 13%; )
image 3
Youpi, pile poil c'que je voulais.
Ouais mais avec une résolution plus haute:
image 4
Ah bah non, ça marche plus !
Remarque, ça m'a permis de voir ou se situe le centre du texte en nombre de caractères.
Résultat, retour à la case départ:
Un espace dans le texte, là où c'est le mieux réparti :
<div style= "text-align:center; margin-left: 5%; margin-right: 5%; font-size:16px; color:#E6E4CA;" face=Verdana>Vendredi soir, pendant le concert de Groundation, des festivaliers nous ont proposé un spectacle<br>alternatif enflammé, et vive, et vive, et vive le feu. Y'à pas à dire, ça a chauffé l'ambiance dans le public.</font></div>
Ca donne ça en 1920 de large:
image 5
Ou ça en 1200 de large.
image 6
Ca passe jusqu'en 1024 de large, mais en 720 de large, vise un peu la catastrophe:
(mon champ de texte est configuré pou 2 lignes maxi)
image 7
Après toutes ces bidouilles, je repose la question initiale:
Il y a-t-il un code HTML qui puisse à la fois justifier et centrer le texte ?
Ton code m'a permis d'insérer une ligne de légende dans mes diaporamas, avec une mise en page beaucoup plus à mon goût que les classic align left rigth et center.
Mais j'arrive pas encore à ce que je souhaite:
Un texte justifié (deux lignes seulement), au centre de la page, avec des lignes de même largeur.
Bref, un texte justifié, et centré à la fois.
Explication en images:
Avec ton code (légérement modifié)
<div style= "text-align:justify; margin-left: 5%; margin-right: 5%; font-size:16px; color:#E6E4CA;" face=Verdana>Vendredi soir, pendant le concert de Groundation, des festivaliers nous ont proposé un spectacle alternatif enflammé, et vive, et vive, et vive le feu. Y'à pas à dire, ça a chauffé l'ambiance dans le public.</font></div>
Ca donne ça avec un écran 24 pouces à 1920 de résolution:
Image 1
Pas de problème, le texte est sur une ligne, facile à centrer:
Mais dès que je passe à une résolution inférieure en largeur (en basculant mon écran en vertical), soit 1200 "seulement", voilà ce que ça donne:
image 2
J'ai essayé avec des marges plus larges:
( margin-left: 13%; margin-right: 13%; )
image 3
Youpi, pile poil c'que je voulais.
Ouais mais avec une résolution plus haute:
image 4
Ah bah non, ça marche plus !
Remarque, ça m'a permis de voir ou se situe le centre du texte en nombre de caractères.
Résultat, retour à la case départ:
Un espace dans le texte, là où c'est le mieux réparti :
<div style= "text-align:center; margin-left: 5%; margin-right: 5%; font-size:16px; color:#E6E4CA;" face=Verdana>Vendredi soir, pendant le concert de Groundation, des festivaliers nous ont proposé un spectacle<br>alternatif enflammé, et vive, et vive, et vive le feu. Y'à pas à dire, ça a chauffé l'ambiance dans le public.</font></div>
Ca donne ça en 1920 de large:
image 5
Ou ça en 1200 de large.
image 6
Ca passe jusqu'en 1024 de large, mais en 720 de large, vise un peu la catastrophe:
(mon champ de texte est configuré pou 2 lignes maxi)
image 7
Après toutes ces bidouilles, je repose la question initiale:
Il y a-t-il un code HTML qui puisse à la fois justifier et centrer le texte ?
bugs02
Messages postés
51
Date d'inscription
mercredi 2 juillet 2008
Statut
Membre
Dernière intervention
23 février 2009
5
17 août 2008 à 12:02
17 août 2008 à 12:02
bonjour ThEBiShOp
Je te remercie pour ton aide. ça fonctionne bien !!!
Je te remercie pour ton aide. ça fonctionne bien !!!
