Exercice 12/25

Dans le fichier stylesheet.css, ajoutez les propriétés nécessaires à l'élément div :

  • pour que le texte soit espacé de 10px du bord du div;
  • pour que le bord du div soit représenté par des tirets de 2px et de couleur #0066ff;
  • pour que le texte s'affiche sur un fond de couleur #ccff99;
  • pour qu'il soit décalé de 25px par rapport à son coin supérieur gauche (utilisez la notation raccourcie);
  • Cliquez sur soumettre ma réponse pour vérifier vos résultats;

Leçon 12/25

Cet exercice est un rappel sur ce que vous venez de voir concernant les marges externes, les marges internes et les bordures.

Commentaires les mieux notés

  • nkeshimanabrice-37

    je cherche les espaces inutiles mais c'est difficile pour moi de les voir...

  • jmulon.pro

    Bonjour une erreur de syntaxe ?

  • christian67260

    Bonjour Idem..! normalement pas d'influence pour le code on peut très bien mettre l'accolade contre ou en dessous c'est pareil..!!! De toute façon ça passe pas avec cet exo également. vous pouvez tester un même code avec une accolade contre ,espacée ou en dessous ça fonctionnera si la syntaxe est bonne.marche rien sous ce corrigé !!

  • juliendo50

    Bonjour Je suis bloqué voici mon code div { height: 50px; width: 100px; border: 2px solid black; border-radius: 5px; background-color: #4D94FF; margin-top: -25px; background-color: #ccff99; margin: 25px 0 0 25px; border: 2px dashed #0066ff; padding: 10px; } html, body { border: 1px dashed #ff0000; }

36 Commentaires

  • jmulon.pro

    jmulon.pro

    Bonjour une erreur de syntaxe ?

    le 07/12/2017 à 17h03

  • mram

    mram Administrateur

    Bonjour, il y a peut-être un espace inutile après l'accolade {

    le 10/12/2017 à 14h34

  • christian67260

    christian67260

    Bonjour Idem..! normalement pas d'influence pour le code on peut très bien mettre l'accolade contre ou en dessous c'est pareil..!!! De toute façon ça passe pas avec cet exo également. vous pouvez tester un même code avec une accolade contre ,espacée ou en dessous ça fonctionnera si la syntaxe est bonne.marche rien sous ce corrigé !!

    le 06/03/2017 à 09h52

  • juliendo50

    juliendo50

    Bonjour Je suis bloqué voici mon code div { height: 50px; width: 100px; border: 2px solid black; border-radius: 5px; background-color: #4D94FF; margin-top: -25px; background-color: #ccff99; margin: 25px 0 0 25px; border: 2px dashed #0066ff; padding: 10px; } html, body { border: 1px dashed #ff0000; }

    le 07/03/2017 à 11h14

  • mram

    mram Administrateur

    Vous avez inversé les propriétés padding et margin ...

    le 20/10/2016 à 13h08

  • ben-leb

    ben-leb

    J'ai le meme souci que mes camarades ci-dessus... (les commentaires datent de 8 mois).

    le 19/10/2016 à 16h44

  • mram

    mram Administrateur

    @christian67260 : votre code lignes 2 à 5 doit avoir une tabulation en plus.

    le 09/03/2017 à 00h51

  • mram

    mram Administrateur

    Ligne 1, ajoutez juste un espace avant l'accolade.

    le 05/03/2017 à 11h12

  • mram

    mram Administrateur

    @juliendo50 : le code à partir de la ligne 13 est inutile. Et il ne faut que 4 propriétés CSS pour le sélecteur "div".

    le 09/03/2017 à 00h53

  • mick.vigouroux

    mick.vigouroux

    Voici mon code : div{ padding:10px; border:2px dashed #0066ff; background-color: #ccff99; margin: 25px 0 0 25px; } On me dit que je devrais avoir une règle css "margin:25px 0 0 25px", elle présent mais je ne peux pas valider. C'est le deuxième exercice que je ne peux pas à cause de cette règle, pourquoi ? il y a une erreur dans ma syntaxe ?

    le 17/02/2016 à 17h59

  • mram

    mram Administrateur

    Bonjour,

    Votre code est à priori correct, je vais vérifier la correction de l'exercice pour résoudre ça rapidement. N'hésitez pas à commenter les autres exercices ou vous rencontrez ce problème, je les corrigerai aussi.

    Cordialement,

    le 18/02/2016 à 01h35

  • callum.chiverto

    callum.chiverto

    Bonjour, j'ai exactement ce meme problem que @mick.vigouroux. Je retounerai bientot pour voir si c'est resolu, merci

    le 23/02/2016 à 17h11

  • mram

    mram Administrateur

    Bonjour,

    En fait, le script de correction a déjà été corrigé, mais n'a pas été envoyé sur le serveur en production. Je n'ai pas les accès pour le faire, mais j'ai envoyé une demande pour que ce soit fait.

    Je reviendrai ici pour vous en informer.

    Cordialement.

    le 23/02/2016 à 21h37

  • ricafortjason

    ricafortjason

    div { padding: 10px; border: 2px dashed #0066ff; background-color: #ccff99; margin: 25px 0 0 25px; }

    le 02/12/2016 à 16h18

  • mram

    mram Administrateur

    Votre code est juste, où est votre souci ??

    le 06/12/2016 à 00h02

  • christian67260

    christian67260

    Bonjour Troisième Exo avec une erreur "Vérifiez la syntaxe du sélecteur pour l'élément <div> ????? je ne peux valider, pourtant le code semble correct ????

    le 02/03/2017 à 13h42

  • salim10_4

    salim10_4

    VÉRIFIEZ LA SYNTAXE DE LA RÈGLE CSS POUR LA MARGE EXTERNE.,VOUS DEVRIEZ AVOIR 1 ÉLÉMENT HTML AVEC LA RÈGLE CSS "MARGIN: 25PX 0 0 25PX". et mon code est le suivant : div { padding: 10px; border: 2px dashed #0066FF; background-color: #CCFF99; margin: 25px 0 0 20px; }

    le 25/03/2017 à 16h12

  • salim10_4

    salim10_4

    une faute de frappe dsl

    le 25/03/2017 à 16h13

  • mrigaut-29

    mrigaut-29

    bonjour, erreur introuvable.merci de votre retour.cdr

    le 28/12/2018 à 22h05

  • meriam

    meriam Administrateur

    Bonjour, votre erreur au niveau de la ligne2, il manque un point virgule à a fin.

    le 30/12/2018 à 16h20

  • ludivore-28

    ludivore-28

    Bonjour, pour l'instruction : pour qu'il soit décalé de 25px par rapport à son coin supérieur gauche (utilisez la notation raccourcie); j'aurais mis margin: 0 0 0 25px (car je le comprends ainsi une seule marge à gauche). Le coin supérieur gauche signifie-t-il espacé vis à vis de la bordure gauche du texte ? C'est pour comprendre mon erreur de départ svp merci

    le 07/08/2018 à 21h06

  • ludivore-28

    ludivore-28

    J'ai compris finalement l'histoire du coin supérieur gauche. Simple logique. merci

    le 07/08/2018 à 21h49

  • elv-argjend.adm-87

    elv-argjend.adm-87

    pour la "margin:25px 0 0 25px", quel est l'ordre des positions, ça ? : -->haut, bas, droit, gauche

    le 23/10/2019 à 17h37

  • meriam

    meriam Administrateur

    Bonjour, pour la notation racourcie margin: avec quatre valeurs, la première s'appliquera en haut, la deuxième à droite, la troisième en bas et la quatrième à gauche (top, right, bottom,left) suivez le sens de des aiguilles d'une montre, c'est plus facile à mémoriser.

    le 25/10/2019 à 12h59

  • mehd.naf.56-14

    mehd.naf.56-14

    pk on me dit le message Vérifiez les blocs de déclarations délimités par les { et }. Vous devriez en avoir 1.

    le 15/08/2018 à 00h04

  • mram

    mram Administrateur

    Le code lignes 7 à 9 est inutile, ce n'est pas demandé dans l'énoncé.

    le 28/08/2018 à 21h51

  • gaudin.yannick69-79

    gaudin.yannick69-79

    div { padding: 10px; border: 2px dashed #0066FF; background-color: #CCFF99; margin: 25px 0 0 25px; }

    le 16/08/2018 à 03h38

  • mram

    mram Administrateur

    Que vous dit le message d'erreur ?

    le 28/08/2018 à 22h08

  • oumaymadani0

    oumaymadani0

    Bonsoir, j'arrive pas à passer à l'exercice suivant voilà mon code div { padding:10px; border: 2px dashed #0066ff; margin: 25px 0px 0px 25px; background-color: #ccff99; }

    le 19/12/2017 à 22h35

  • mram

    mram Administrateur

    Bonjour, quand on met une valeur CSS numérique à zéro ( 0 ) , alors il est recommandé de ne pas mettre d'unité, puisque ça ne sert à rien finalement.

    le 23/12/2017 à 16h33

  • cbngong-61

    cbngong-61

    Bonjour, je ne comprends pas mon erreur. J'ai le meme problème que la plupart des personnes d'après ce que j'ai vu.

    le 17/08/2018 à 05h53

  • mram

    mram Administrateur

    Bonjour, quel message d'erreur avez-vous ? Ca sera plus facile de vous aider.

    le 27/08/2018 à 22h22

  • hotz.cedric-81

    hotz.cedric-81

    je ne comprend pas l erreur "Vérifiez la syntaxe du sélecteur pour l'élément <div>"voici mon code:div { padding: 10px; border: 2px dashed #0066FF; background-color: #CCFF99; margin: 25px 0 0 25px; }

    le 31/03/2018 à 11h41

  • mram

    mram Administrateur

    Bonjour, vous avez des espaces inutiles après l'accolade { . On attend un retour à la ligne directement.

    le 01/04/2018 à 02h54

index.html
stylesheet.css
<!DOCTYPE html> <html> <head> <link type="text/css" rel="stylesheet" href="stylesheet.css" /> <title>Rappel</title> </head> <body> <div> Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. </div> </body> </html>