Forum |  HardWare.fr | News | Articles | PC | S'identifier | S'inscrire | Shop Recherche
1271 connectés 

  FORUM HardWare.fr
  Programmation
  HTML/CSS

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

 


 Mot :   Pseudo :  
 
Bas de page
Auteur Sujet :

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

n°1088305
Nigel_
Posté le 18-05-2005 à 18:18:07  profilanswer
 

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
mood
Publicité
Posté le 18-05-2005 à 18:18:07  profilanswer
 

n°1088345
The-Shadow
Développeur
T'as été voir dans ton profil?
Posté le 18-05-2005 à 18:45:51  profilanswer
 

Tu peux le faire avec un padding-bottom.

n°1088442
masklinn
í dag viðrar vel til loftárása
Posté le 18-05-2005 à 20:38:49  profilanswer
 

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
n°1088461
Nigel_
Posté le 18-05-2005 à 20:56:37  profilanswer
 

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
n°1088469
The-Shadow
Développeur
T'as été voir dans ton profil?
Posté le 18-05-2005 à 21:05:31  profilanswer
 

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
n°1088489
masklinn
í dag viðrar vel til loftárása
Posté le 18-05-2005 à 21:36:11  profilanswer
 

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
n°1088494
The-Shadow
Développeur
T'as été voir dans ton profil?
Posté le 18-05-2005 à 21:43:20  profilanswer
 

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
n°1088500
masklinn
í dag viðrar vel til loftárása
Posté le 18-05-2005 à 21:53:03  profilanswer
 

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
n°1088504
gm_superst​ar
Appelez-moi Super
Posté le 18-05-2005 à 21:59:39  profilanswer
 

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
n°1088519
masklinn
í dag viðrar vel til loftárása
Posté le 18-05-2005 à 22:10:59  profilanswer
 

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
mood
Publicité
Posté le 18-05-2005 à 22:10:59  profilanswer
 

n°1088520
The-Shadow
Développeur
T'as été voir dans ton profil?
Posté le 18-05-2005 à 22:11:13  profilanswer
 

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

n°1088525
gm_superst​ar
Appelez-moi Super
Posté le 18-05-2005 à 22:12:21  profilanswer
 

Aller à :
Ajouter une réponse
  FORUM HardWare.fr
  Programmation
  HTML/CSS

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

 

Sujets relatifs
CSS : deux menus horizontaux sur la même lignepb mise en ligne site internet
php en ligne de commande sous linuxIndice de ligne dans une requête SQL
figer une ligne sous excelComment mettre le programme televison en ligne ?
dessiner une ligne dans un canva grace a un mouse pressedcréer un mail par une ligne de code C# [résolu]
Probleme de saut de ligne 
Plus de sujets relatifs à : Régler la largeur d'un saut de ligne <p>


Copyright © 1997-2022 Hardware.fr SARL (Signaler un contenu illicite / Données personnelles) / Groupe LDLC / Shop HFR