Notion de marges en CSS
Comment définir une marge avec CSS ?

Les marges en CSS

Exemple de Padding et marge css

Comment définir une marge avec CSS ?

Héritage : : Il n'y pas de notion d'héritage pour les marges (voir notion d'héritage (avec les feuilles de styles) sur ce lien)

Syntaxe CSS

margin-top: espace en pixels, pourcentage ou auto;
margin-left: espace en pixels, pourcentage ou auto;
margin-right: espace en pixels, pourcentage ou auto;
margin-bottom: espace en pixels, pourcentage ou auto;

Vous avez 3 possibilités pour définir la valeur de la marge :
  1. Espace en pixels (exemple 10px)
  2. Pourcentage (70%)
  3. auto (réglage automatique)
A noter : Vous pouvez aussi déclarer vos marges en css comme cela : margin: 10px 10px 10px 10px;

Les valeurs définissent l'espace entre les éléments HTML dans cet ordre :
  1. haut
  2. droite
  3. bas
  4. gauche
A savoir !
Si ne renseignez qu'une valeur, elle sera prise par défaut pour les autres espaces entre les éléments HTML : margin: 10px; pour par exemple les marges sur (espace sur des listes type li)
Si vous renseignez deux ou trois valeurs, elles seront la références pour les cotés opposés.
margin: 10px 10px; /* 2 valeurs */
margin: 10px 10px 10px; /* 3 valeurs */
Vous pouvez définir des marges à zéro, Si vous ne définissez pas les marges, elles prenent 0 comme valeur par défaut : margin: -10px;
De nombreuses différences entre navigateurs résultes de problèmes de marges définie différement entre deux navigateurs. Pour combattre cela, il suffit de les mettres à "0"
p {margin: 0;}

Attention : Il est possible de ne pas mettre "px" si la valeur est zéro (Voir exemple ci-dessus)
Exemple concert ?
L'exemple ci-dessous défini une marge de 20px à la balise BODY
body{
  margin: 20px;
  background: #eeeeee;
  font-size: small;
  font-family: "Tahoma", Arial, sans-serif;
  text-align: left;
}

Voulez-vous laisser une note ou un commentaire ?

Avis sur la page https://www.cssdebutant.com/coder-en-css-les-marges-margins.html Votes: 4.1 / 5 étoiles - 30 vote(s) et 10 commentaires