Régler la largeur d'un saut de ligne <p>

Régler la largeur d'un saut de ligne <p> - HTML/CSS - Programmation

Marsh Posté le 18-05-2005 à 18:18:07    

Dites, je me pose la question depuis un certain temps... C'est une des raisons pour laquelle je n'utilise jamais de balise <p> d'ailleurs.
 
Quel est le paramètre css pour régler la hauteur d'un saut de ligne d'une balise <p> ?
Line-height règle la hauteur d'espacement entre deux lignes, mais pas le saut de ligne...
 
En gros j'aimerai passer de:
 

Citation :


Ligne 1
 
                >> par défaut
Ligne 2


 
à
 

Citation :


Ligne 1
                >> px définit
Ligne 2


 
l'exemple est grossier, évidemment la largeur n'est pas aussi énorme


Message édité par Nigel_ le 18-05-2005 à 18:18:43

---------------
RPGamers, la passion du RPG : http://www.rpgamers.fr
Reply

Marsh Posté le 18-05-2005 à 18:18:07   

Reply

Marsh Posté le 18-05-2005 à 18:45:51    

Tu peux le faire avec un padding-bottom.

Reply

Marsh Posté le 18-05-2005 à 20:38:49    

Nigel_ a écrit :

Dites, je me pose la question depuis un certain temps... C'est une des raisons pour laquelle je n'utilise jamais de balise <p> d'ailleurs.
 
[/quote]
 
l'exemple est grossier, évidemment la largeur n'est pas aussi énorme


Il faut régler les marges verticales (margin-top et margin-bottom) et les "remplissages" verticaux (padding-top et padding-bottom)
 
Ton problème vient ici des marges verticales par défaut des paragraphes, réglées aux alentours d'1em (les paragraphes ne semblent pas avoir de padding).
 
Essaie un style du type

p {
   margin: 0.5em 0;
}


 
(à noter que les marges des paragraphes sont réglées pour fusionner: si un paragraphe avec une marge inférieure de 1em est suivi par un autre paragraphe de marge supérieure 1em, les marges vont fusionner et donner 1em et non 2, ce qui signifie qu'il faut jouer en simultané sur les deux marges pour voir un changement, ne réduire que l'une des deux *semble* ne rien changer à cause de la fusion des marges)


Message édité par masklinn le 18-05-2005 à 20:40:21

---------------
Stick a parrot in a Call of Duty lobby, and you're gonna get a racist parrot. — Cody
Reply

Marsh Posté le 18-05-2005 à 20:56:37    

Hayl yes, ça marche impec'!
 
Merci pour le tuyau, je n'aurais jamais pensé à utiliser "bêtement" les margin pour des paragraphes.
 :jap:


---------------
RPGamers, la passion du RPG : http://www.rpgamers.fr
Reply

Marsh Posté le 18-05-2005 à 21:05:31    

masklinn a écrit :

(les paragraphes ne semblent pas avoir de padding)


Y'a un truc que j'ai pas pigé là, je fais ça tout le temps perso. Si c'est pas bien, dites le moi.
 
http://orolam.online.fr/forums/parag.php


Message édité par The-Shadow le 18-05-2005 à 21:06:18
Reply

Marsh Posté le 18-05-2005 à 21:36:11    

Nigel_ a écrit :

Hayl yes, ça marche impec'!
 
Merci pour le tuyau, je n'aurais jamais pensé à utiliser "bêtement" les margin pour des paragraphes.
 :jap:


Ce genre de trucs est toujours réglé par les valeurs par défaut de margin et padding, c'est pareil pour le décalage horizontal des éléments de liste (sauf que là ça dépend du navigateur, certains appliquent un padding au conteneur de liste, d'autres un margin à l'élément de liste, alors que pour les paragraphes tous les navigateurs ont l'air d'utiliser margin par défaut, et jamais padding).
 
Le meilleur moyen de partir de quelque chose de "propre" c'est de coller

* {  
    margin: 0;
    border: 0;
    padding: 0;
}


Au début de chaque CSS, mais ça oblige à recréer énormément de style dans la mesure ou la grande majorité des styles par défaut disparaît.
 
Par contre ça permet de s'assurer qu'à ce niveau là tu n'as que ce que tu veux.
(modulo les problèmes de marges dédoublées et autres box models d'IE)

The-Shadow a écrit :

Y'a un truc que j'ai pas pigé là, je fais ça tout le temps perso. Si c'est pas bien, dites le moi.
 
http://orolam.online.fr/forums/parag.php


Essaie de réduire la distance verticale entre deux paragraphes maintenant http://membres.lycos.fr/angel2k/petrus/petrustukka.gif


Message édité par masklinn le 18-05-2005 à 21:36:44

---------------
Stick a parrot in a Call of Duty lobby, and you're gonna get a racist parrot. — Cody
Reply

Marsh Posté le 18-05-2005 à 21:43:20    

masklinn a écrit :

Essaie de réduire la distance verticale entre deux paragraphes maintenant http://membres.lycos.fr/angel2k/petrus/petrustukka.gif


Et ?  
J'ai fixé le margin à 0 pour les 3 pour bien montrer que les espaces était réglés par le padding. par défaut - 60 - 0, ça fonctionne. Il est où le problème ?
 
http://orolam.online.fr/forums/parag.php  http://membres.lycos.fr/angel2k/petrus/petrustukka.gif


Message édité par The-Shadow le 18-05-2005 à 21:45:08
Reply

Marsh Posté le 18-05-2005 à 21:53:03    

The-Shadow a écrit :

Et ?  
J'ai fixé le margin à 0 pour les 3 pour bien montrer que les espaces était réglés par le padding. par défaut - 60 - 0, ça fonctionne. Il est où le problème ?
 
http://orolam.online.fr/forums/parag.php  http://membres.lycos.fr/angel2k/petrus/petrustukka.gif


 :pfff:  
 
Simple: les réglages par défaut utilisent les marges (collapsable), quel est l'intérêt d'utiliser des paddings (et donc de devoir prendre en compte les marges par défaut en sus ou devoir retirer les marges en plus de la manipulation de paddings) dans ce cas?
 
Le fait est que si tu veux réduire les distances entre deux paragraphes, tu dois utiliser les marges.
Le fait est que la chose est logique, la zone vide entre deux paragraphes ne fait partie d'aucun paragraphe (rappel: le padding est à l'intérieur de l'élément, le margin en dehors)
Le fait est qu'utiliser le padding pour régler la distance entre deux paragraphes, sauf besoin de colorations continues ou de collapsed borders, n'a aucun sens.


---------------
Stick a parrot in a Call of Duty lobby, and you're gonna get a racist parrot. — Cody
Reply

Marsh Posté le 18-05-2005 à 21:59:39    

masklinn a écrit :

(les paragraphes ne semblent pas avoir de padding).


Disons que, par défaut, la plupart (tous ?) des navigateurs ne donne pas de padding aux paragraphes.
 
 
Sinon pour le reste, marges et padding n'ont effectivement pas la même utilité ni le même sens, même si en l'absence de bordure leurs effets peuvent se ressembler.


Message édité par gm_superstar le 18-05-2005 à 22:00:03

---------------
Incongru : une FAQ abandonnée sur les Standards du Web - FAQ périmée de blabla@Prog
Reply

Marsh Posté le 18-05-2005 à 22:10:59    

The-Shadow a écrit :

ET le padding, autrement, comme dans mon exemple, tu auras toujours un espace.


Non, le seul espace qui existe avec le padding par défaut (qui est de 0) est l'interligne [:spamafote]


---------------
Stick a parrot in a Call of Duty lobby, and you're gonna get a racist parrot. — Cody
Reply

Marsh Posté le 18-05-2005 à 22:10:59   

Reply

Marsh Posté le 18-05-2005 à 22:11:13    

Autant pour moi, j'ai dis une connerie, je le reconnais sans peine :jap: (c'est pas fréquent ici).

Reply

Marsh Posté le 18-05-2005 à 22:12:21    

Reply

Sujets relatifs:

Leave a Replay

Make sure you enter the(*)required information where indicate.HTML code is not allowed