Help pour décalage paragraphes ! Résolu/Fermé

Question

Bonjour, J'aimerai séparer les 2 paragraphes, actuellement ils sont comme ça : http://img15.hostingpics.net/pics/391579Capture.png mais le paragraphe de droite (en l'occurrence Services) et trop près du paragraphe gauche. Et donc j'aimerai le décaler vers la droite. Mais étant débutant en web je ne maitrise pas énorment toute les balises .. Code HTML

Bienvenue

guillemets Praesent urna risus, fermentum eget euismod eu, placerat id felis. In venenatis sapien et mauris dictum sodales ac et mi. Ut pulvinar, metus facilisis sodales pellentesque, arcu felis tempor ligula, eget dignissim dolor purus ut ante. Sed et risus non velit ornare condimentum ac eget risus.

CODE CSS h1, h2, h3, h4, h5, h6 { font-family: "Trebuchet MS", Arial, Helvetica, sans-serif; font-weight: bold; color:#111;} h1 { font-size:30px; line-height:1; margin-bottom:0.5em; } h2 { font-size:190%; font-weight: normal; margin-bottom:0.75em; letter-spacing: -0.5px;} h2[title="services"] { text-align: left; } h3 { font-size:100%; line-height:1; margin-bottom:1em; } h4 { font-size:1.2em; line-height:1.25; margin-bottom:1.25em; } h5 { font-size:1em; margin-bottom:1.5em; } h6 { font-size:1em; } h1 img, h2 img, h3 img, h4 img, h5 img, h6 img { margin:0;} /* Paragrafi */ p { font-family: "Trebuchet MS", Arial, Helvetica, sans-serif; padding: 4px 0 4px 0; line-height: 22px; font-size: 13px; color: #999; text-align: left; Configuration: Windows 7 / Firefox 9.0.1

AnthraxProd · Answer

Up s'il vous plait c'est compliqué :'(

AssassinTourist · Answer

Rajoute un margin dans le css de ton p. C'est le même principe que padding, mais à l'extérieur de ton p. (je ne suis sûrement pas clair, mais teste et tu verras que tes paragraphes se sépareront plus). 

Pour plus de compréhension, tu peux découper le margin (et le padding) de la même manière : 
margin-right, margin-left, margin-top, margin-bottom
Comme ça, tu ne pourras l'appliquer que sur un seul côté de ton p.

AssassinTourist · Answer

Avec le code que tu nous as donné, je n'ai pas réussi à avoir le rendu de l'image que tu m'as donné...

Si tu veux trouver toi-même les problèmes de présentation, télécharge le plugin Firebug de Firefox.

olivierrobins · Answer

Bonjour, Est-ce qu'on pourrait voir le code complet pour cette section?

Bienvenue

guillemets Praesent urna risus, fermentum eget euismod eu, placerat id felis. In venenatis sapien et mauris dictum sodales ac et mi. Ut pulvinar, metus facilisis sodales pellentesque, arcu felis tempor ligula, eget dignissim dolor purus ut ante. Sed et risus non velit ornare condimentum ac eget risus.

Car le code ci-dessus ne représente que le premier titre et premier paragraphe. Pour firebug, il suffit de l'activer et ensuite en haut à gauche (de la fenêtre firebug) il y a un rectangle. Clique sur le rectangle et ensuite passe la souris sur 'élément qui pose problème (donc le 2e paragraphe). Dans la fenêtre firebug le code CSS pour la section concernée apparaît, et tu peux y faire directement des changements et voir le résultat. Tu peux aussi voir les marges etc.

olivierrobins · Answer

Je viens d'aller voir le code, et me rends compte que maintenant qu'il s'agit du site sur lequel je t'avais déjà aidé l'autre jour pour un autre détail :) Désolé de ne pas avoir reconnu ton pseudo ;) Donc, ton site.. Il faut ouvrir le fichier 960.css et y inclure n'importe où ça: .coldroite{margin-left:100px;} Et ouvrir le fichier index.html, trouver cette section:

Services

et remplacer par ça:

Services

J'ai ajouté une deuxième classe à la div de droite, ainsi le CSS peut gérer la marge de ce bloc sans que ça affecte celui de gauche. Pour modifier l'espace, il suffira ensuite de changer la valeur des 100px dans le CSS.

AnthraxProd · Answer

Merci c'est Génial mon problème est réglé ! :D
Pour finaliser le tout j'aimerai y placer une barre verticale d'1 px comment pourrais faire ?

Help pour décalage paragraphes !

6 réponses

Discussions similaires