Exercice 8/25

  • Dans le fichier stylesheet.css, modifiez la propriété margin et utilisez la notation raccourcie pour appliquer une marge externe en haut de 20px, à droite de 50px, en bas de 10px et à gauche de 5px;
  • Cliquez sur soumettre ma réponse pour vérifier vos résultats;

Leçon 8/25

Si vous voulez ajuster une marge en particulier, vous pouvez le faire comme cela :

    margin-top: /* Valeur de la marge externe du haut */
    margin-right: /* Valeur de la marge externe de droite */
    margin-bottom: /* Valeur de la marge externe du bas */
    margin-left: /* Valeur de la marge externe de gauche */        
    

Vous pouvez aussi définir toutes les marges externes d'un élément avec la notation raccourcie. Il suffit juste de partir du haut et de tourner dans le sens des aiguilles d'une montre (Haut Droite Bas Gauche), comme cela :

    margin: 1px 2px 3px 4px
    

Commentaires les mieux notés

27 Commentaires

  • doucouremadi5-17

    doucouremadi5-17

    Aide je suis bloqué voici mon :div { height: 50px; width: 100px; border-radius: 5px; margin:20px 50px 10px 5px }

    le 08/09/2021 à 10h06

  • meriam

    meriam Admin

    Bonjour, ne touchez pas le code initial, il suffit de modifier la valeur de la propriété margin.

    le 17/09/2021 à 11h21

  • rosirisf77-81

    rosirisf77-81

    il me dit qu'il me manque la regle css pour la balise div

    le 02/12/2020 à 18h51

  • meriam

    meriam Admin

    il faut supprimer cette écriture (top,right,bottom,left)==>

    le 02/12/2020 à 23h06

  • rosirisf77-81

    rosirisf77-81

    bonsoir, mon css ne fonctionne pas

    le 01/12/2020 à 21h40

  • meriam

    meriam Admin

    Bonjour, il faut supprimer "raccourcie-hight : 20px " (raccourcie-hight ce n'est pas une propriété). Pour la marge, il faut utiliser la propriété raccourcie :margin, au lieu d'utiliser les propriétés détaillées (margin-left, margin-bottom, margin-right, margin-left)

    le 02/12/2020 à 07h46

  • meriam

    meriam Admin

    Pour la propriété margin, vous devez attribuer les valeurs de chaque coté en suivant le sens de l'aiguille du montre (top, right,bottom,left)==> margin : 20px 50px 10px 5px

    le 02/12/2020 à 10h19

  • b.patou59-65

    b.patou59-65

    bonjour j'ai fait l'exercice comme il est dit dans l"ennocé eet ça ne fonctionne pas :(

    le 22/06/2020 à 06h19

  • meriam

    meriam Admin

    Bonjour, supprimez la propriété margin et la valeur auto et laissez margin: 50px 20px 10px 5px (on n'ajoute pas le style solid et une couleur pour une marge)

    le 22/06/2020 à 08h29

  • boccyan47-99

    boccyan47-99

    Bonjour, je suis bloqué

    le 20/02/2019 à 18h53

  • meriam

    meriam Admin

    utilisez la notation raccourcie avec la propriété margin.

    le 21/02/2019 à 10h12

  • nkeshimanabrice-37

    nkeshimanabrice-37

    ok merci...

    le 19/10/2018 à 08h54

  • hellwyn6

    hellwyn6

    Dans le titre c'est écrit haut bas gauche droite pourtant dans la leçon c'est haut droite bas gauche

    le 02/09/2018 à 12h48

  • mram

    mram Admin

    Ce n'est pas très grave. Retenez ce qui est dit dans la leçon. Le titre de l'exercice est juste indicatif.

    le 09/09/2018 à 23h29

  • mram

    mram Admin

    il faut utiliser la notation raccourcie ...

    le 12/06/2017 à 10h26

  • pizzutoandrea3

    pizzutoandrea3

    peite aide

    le 05/06/2017 à 20h10

index.html
stylesheet.css
<!DOCTYPE html> <html> <head> <link type="text/css" rel="stylesheet" href="stylesheet.css" /> <title>Marge externe : haut, bas, gauche, droite</title> </head> <body> <div></div> </body> </html>
div { height: 50px; width: 100px; border: 2px solid black; border-radius: 5px; background-color: #4D94FF; margin: auto; } html, body { border: 1px dashed #ff0000; }