Xhtml, saut de ligne <p> IE et Firefox

Résolu/Fermé
nono313 Messages postés 189 Date d'inscription mardi 3 juin 2008 Statut Membre Dernière intervention 26 octobre 2011 - 30 août 2008 à 14:23
nono313 Messages postés 189 Date d'inscription mardi 3 juin 2008 Statut Membre Dernière intervention 26 octobre 2011 - 30 août 2008 à 21:24
Bonjour,
j'ai récemment fais des changement dans mon site pour la validation xhtml strict.
J'ai donc rajouté beaucoup de balise <p> et je viens de me rendre compte que ces balises effectues des saut de ligne que je ne souhaite pas avoir.
Comment peut-on supprimer ces saut de ligne ? en CSS ?

3 réponses

LeYaude Messages postés 304 Date d'inscription vendredi 24 août 2007 Statut Membre Dernière intervention 8 février 2009 46
30 août 2008 à 14:56
Oui ces sauts de ligne sont corrigeables en CSS, via les propriétés padding et margin. Par exemple pour supprimer toutes les marges sur les paragraphes en haut et en bas :

p
{
margin-top : 0px;
margin-bottom : 0px;
}

Après tu peux ajuster si tu veux quand même un petit peu de marge mais pas trop. Et ti tu veux mettre un fond aux paragraphes mais que le texte ne soit pas trop "collé au bord", il faut utiliser padding. C'est l'équivalent de margin pour gérer les marges interieures des blocs (alors que margin gère les marges extérieures des blocs).
5
dj_o_3122 Messages postés 14 Date d'inscription dimanche 23 septembre 2007 Statut Membre Dernière intervention 30 août 2008 13
30 août 2008 à 16:35
Si tu veux une solution plus simpliste, parfois tu peux insérer une balise <br/> au lieu de refermer tes balises <p> et en ouvrir une autre toude suite.

Exemple :

<p>Hello</p>
<p>Ca va ?</p>

Pour qu'il n'y ai pas de saut de ligne entre les deux, tu peux simplement écrire :

<p>Hello<br/>Ca va ?</p>
3
nono313 Messages postés 189 Date d'inscription mardi 3 juin 2008 Statut Membre Dernière intervention 26 octobre 2011 27
30 août 2008 à 21:24
j'avais déjà pensé a cette solution mais elle ne m'intéresse pas trop car mes paragraphes sont séparés apr des titre 1 et h2.

J'ai trouvé une solution avec ce code CSS:
* {
margin:0; 
padding:0;
}
3