Partage

comment créer une ligne de séparation

Sujet résolu
12 mars 2018 à 0:33:44

Bonjour,

Je me permets de poster ce sujet car je bloque depuis quelques heures déjà, et ce sais pas si ce n'arrive pas à pbtenir ce que je veux car le problème est CSS ou HTML. (je pense que c'est css mais bon, j'ai besoin d'aide là)

Ma question est, comment créer une ligne de séparation entre mes deux paragraphes ci dessous ? (j'aimerais aussi par la suite diminuer l'espacement entre le titre H3 et le paragraphe mais, cela est secondaire....

Je post en PJ code HTML + CSS

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
        <title>OpenClassRooms</title>
        <link rel="stylesheet" href="ocr.css" />
        <link rel="stylesheet" href="images/">
    </head>
        <!-- ICI ENTETE DE LA PAGE -->
    <body>
                <!-- ICI LE CORPS DE LA PAGE -->
        <div class="stories">
            <div class="Marilyn">
        <h3>Titre1</h3>
                <p class="btra">Poolside<br>
            ... (beaucoup de texte) ...... (beaucoup de texte) ...... (beaucoup de texte) ...... (beaucoup de texte) ...... (beaucoup de texte) ...... (beaucoup de texte) ...... (beaucoup de texte) ...... (beaucoup de texte) ...... (beaucoup de texte) ...... (beaucoup de texte) ...... (beaucoup de texte) ...</p>
        
        <h3>Titre2</h3>
        <p class ="bn">Creepin<br>
            ... (beaucoup de texte) ...... (beaucoup de texte) ...... (beaucoup de texte) ...... (beaucoup de texte) ...... (beaucoup de texte) ...... (beaucoup de texte) ...... (beaucoup de texte) ...... (beaucoup de texte) ...... (beaucoup de texte) ...... (beaucoup de texte) ...... (beaucoup de texte) ...</p>
            </div>
        </div>    
                
</body>
</html>
body {background-color: beige} /*couleur d'arriére plan du corps de page*/

.stories {width:850px; /*largeur de page*/
	    height:auto; /*hauteur de page*/
	    background:#D3D3D3;
        border-radius:10px; /*arrondi du cadre*/
        border: 7px solid black;/*affecte un style et une couleure à bordure de div*/;
        font-family: Georgia, serif;
        font-style: italic;
        font-size: 18px;
        padding: 15px; /*marge interieur - entre texte et cadre*/
        margin: auto; /*marge extérieur - entre l'extérieur et le cadre*/
}

h3 {color:darkblue
}

.btra {
    color:#8B008B;
         /*ligne séparation de div*/
        
}

.bn {color: #B22222
/*ligne séparation de div*/   
}

conteneur paragraphes


Par avance merci pour votre aide la communauté

Vous êtes demandeur d'emploi ?
Sans diplôme post-bac ?

Devenez Développeur web junior

Je postule
Formation
en ligne
Financée
à 100%
12 mars 2018 à 11:05:44

Hello,

Il existe une balise pour créer une ligne de séparation, c'est la balise <hr>.

Ensuite, pour l'espacement entre le titre et le paragraphe, réduis le margin-bottom de ton h3 et le margin-top de ton paragraphe.

PS : Tu as oublié des ; à certains endroits dans ton CSS.

12 mars 2018 à 11:46:53

Merci pour ton retour MrChampy

Mais la balise <hr> tu la poses sur quel attribut sur la .class, la <div> ou l'attribut <p> ?

Merci

//////////////////////////////////

Ah non c'est bon laisse j'ai trouvé. 

C'est une balise html pas css. 

Il ne me reste plus qu'a appliquer un style dessus maintenant. 

-
Edité par jelmouss 12 mars 2018 à 11:51:35

comment créer une ligne de séparation

× Après avoir cliqué sur "Répondre" vous serez invité à vous connecter pour que votre message soit publié.
× Attention, ce sujet est très ancien. Le déterrer n'est pas forcément approprié. Nous te conseillons de créer un nouveau sujet pour poser ta question.
  • Editeur
  • Markdown