Le modèle de boîte (Box Model) — Correction d'exercices

Voici des propositions de solutions en mode console (via readline()). N’hésite pas à les adapter.

#1 — Bordure

Ajoute une bordure de 2px solide et grise à une image.

Voir le corrigé

img {
    border: 2px solid gray;
}

Ajoute une marge interne de 15px de tous les côtés pour la classe 'card'.

Voir le corrigé

.card {
    padding: 15px;
}

Centre horizontalement un bloc de 500px de large en utilisant les marges.

Voir le corrigé

.container {
    width: 500px;
    margin: 0 auto;
}

Force le modèle de boîte à inclure le padding et la bordure dans la largeur totale.

Voir le corrigé

* {
    box-sizing: border-box;
}

Arrondis les coins d'un bouton de 10px.

Voir le corrigé

button {
    border-radius: 10px;
}