Justification automatique
faire en sorte que tous les posts d'un forum soit justifié
Titre ; Justification automatique des posts
Langage ; CSS
Niveau ; Débutant
Il n'y a pas grand chose à expliquer là, c'est plutôt un code à copier/coller tout simple, auquel on peut ajouter des effets css que je vais un peu détailler. Vous avez du remarquer que Forumactif n'a pas ajouté le justification de ces posts. Donc, si le membre qui poste ne justifie pas lui-même, c'est assez moche. Le principe est donc de travailler sur la class qui régit tous les posts du forum, c'est à dire
.postbody. Donc, on rajoute du CSS à cette balise dans notre feuille de style CSS (
Panneau d'administration ► Affichage ► Images & Couleurs ► Couleurs ► Feuille de style CSS). Nous allons donc spécifier à cette class qu'elle doit justifier le texte qu'elle contient :
- Code:
-
.postbody /*justification automatique des posts*/ {
display: block;
text-align: justify;}
Eh mais ! C'est quoi ce
display:block qui accompagne notre justification ? No panic. Le display oblige la class .postbody à agir sur tout le bloc, mieux vaut ne pas l'enlever. N'oubliez pas de valider votre feuille de style CSS et allez voir le résultat !
Autres effets ; Bon, on a justifié nos posts, c'est ce qu'on voulait faire, et ça suffit largement. Je vous propose d'en rajouter une couche. Par exemple, les posts sont collés aux bords de leur cellule. On peut arranger ça grâce à un
padding (marge intérieure, donc). Retour à notre feuille de style CSS :
- Code:
-
.postbody /*justification automatique des posts*/ {
display: block;
text-align: justify;
padding: 10px;}
Rappel ; Vous pouvez choisir une taille différente de la marge selon le côté grâce à -top, -right, -bottom, -left.
Vous pouvez également ajouter une couleur de fond différente avec
background-color, une bordure avec
border (là, encore -top, -right, -bottom, -left pour des bordures différentes), vous pouvez changer la couleur du texte (color), la police (font-family), la taille de la police (font-size), et ainsi de suite. Pensez à valider votre feuille de style CSS !
Si vous avez des questions, je suis à votre disposition !