AccueilAccueil  Dernières imagesDernières images  RechercherRechercher  S'enregistrerS'enregistrer  ConnexionConnexion  

Le Deal du moment :
Nike : Jusqu’à 50% sur les articles de ...
Voir le deal

Partagez
 

 [Tutoriel n°1] Justification automatique (messages)

Voir le sujet précédent Voir le sujet suivant Aller en bas 
AuteurMessage

SweetGumiho
an ideas explorer
SweetGumiho

Messages : 152
Inscription : 18/07/2015
Région : Bordeaux

[Tutoriel n°1] Justification automatique (messages) Empty
MessageSujet: [Tutoriel n°1] Justification automatique (messages)   [Tutoriel n°1] Justification automatique (messages) EmptyJeu 23 Juil - 9:13


Tutoriel n°1
--- Justification automatique (messages) ---
■ ■ ■

Ce code consiste en la justification automatique du texte d'un message. Il est utile pour les forums car la justification organise le texte et le rend plus agréable à la lecture, très pratique lorsque les textes sont assez longs.

1. Suivre ce chemin : Panneau d'administration > Affichage > Couleurs.

2. Cliquer sur l'ongle Feuille de style CSS.

3. Ajouter le code suivant :

Code:
 .postbody {
    display: block;
    text-align:justify;
}
La propriété text-align permet de travailler sur l'alignement du texte. Par défaut, elle vaut left (à gauche). Ici on la fixe à justify afin de justifier le texte; mais nous aurions pu le centrer (center) ou le placer à droite (right) également. Le display:block qui accompagne la justification oblige la class .postbody à agir sur tout le bloc. Il vaut mieux ne pas l'enlever.

4. Le problème est que cela donne un texte qui est collé des deux côtés à la marge. Pour remédier à ce problème, il suffit de modifier le padding (la marge intérieure).

Code:
   padding: 00px;
ou
Code:
   padding-left: 00px;
    padding-right: 00px;

5. Remplacer les 0 par le nombre de pixels souhaité qui correspond à la taille de l'espace entre le texte et la marge.

6. Placer votre personnalisation dans la feuille de codes :

Code:
.postbody {
    display: block;
    padding-left: 00px;
    padding-right: 00px;
    text-align:justify;
}

Voici un autre code similaire :
Code:
.postbody {
    display: block;
    text-align: justify;
    padding: 00px;
}

7. Valider la feuille de style CSS et aller voir le résultat !

Rappels :
- Le chemin est : Panneau d'administration ► Affichage ► Images & Couleurs ► Couleurs ► Feuille de style CSS
- Il est possible de choisir une taille différente de la marge selon le côté grâce à -top, -right, -bottom, -left.
- Penser à valider la feuille de CSS !

Remarque : Il sera toujours possible de mettre les textes en alignement droit, gauche, etc ... Ce code ne fait que justifier les textes par défaut.

Si vous avez des questions, je suis à votre disposition !   [Tutoriel n°1] Justification automatique (messages) 4205182009

Revenir en haut Aller en bas
 

[Tutoriel n°1] Justification automatique (messages)

Voir le sujet précédent Voir le sujet suivant Revenir en haut 
Page 1 sur 1

 Sujets similaires

-
» [Tutoriel n°8] Redimensionnement automatique des images
» [Tutoriel n°2] Suppression des colonnes "Sujets" et "Messages" (phpBB2 & phpBB3)
» [Tutoriel n°3] Suppression de la mention "Dernière édition"
» [Tutoriel n°4] Suppression de la boîte de recherche (phpBB3)
» [Tutoriel n°7] Comment utiliser/désactiver la ToolBar ?

Permission de ce forum:Vous ne pouvez pas répondre aux sujets dans ce forum
creative minds :: à valider-