Margem (Margin)
É a área de espaço fora da borda, criando um espaço entre o elemento atual e seus elementos vizinhos.
Nota
A margem é definida pelas propriedades
margin-top,margin-right,margin-bottomemargin-left.
Sintaxe
/* Aplica para todos os quatro lados */
margin: 1em;
/* vertical | horizontal */
margin: 5% auto;
/* topo | horizontal | inferior */
margin: 1em auto 2em;
/* topo | direita | inferior | esquerda */
margin: 2px 1em 0 auto;
/* Valores globais */
margin: inherit;
margin: initial;
margin: unset;Exemplo
<div class="center">Este elemento está centralizado.</div>
<div class="outside">
Este elemento está posicionado fora de seu bloco recipiente.
</div>.center {
margin: auto;
background: lime;
width: 66%;
}
.outside {
margin: 3rem 0 0 -3rem;
background: cyan;
width: 66%;
}