Sei que tem diferenças mas queria entender o porque..
Você está vendo a versão anterior da nova experiência da Alura que estamos preparando para você. Em breve, ela ganha uma identidade visual novinha totalmente pensada em potencializar seus estudos!
Sei que tem diferenças mas queria entender o porque..
Fala Nicolas, tudo bem? Vamos lá:
Quando usamos padding: 20px 0, estamos atribuindo um padding para top (em cima) e bottom(em baixo) de 20px e 0px para right (direita) e left (esquerda).
Quando usamos o padding: 20px, estamos atribuindo o espaçamento para todos os lados da box, ou seja: top, right, bottom e left.
Basicamente podemos realizar a declaração do padding de quatro maneiras, sendo elas:
padding: TODOS_OS_LADOS;
padding: TOP_BOTTOM RIGHT_LEFT
padding: TOP RIGHT_LEFT BOTTOM;
padding: TOP RIGHT BOTTOM LEFT;Espero ter ajudado.
Olá, Nicolas, tudo bem? o uso do padding pode ser:
.class{
padding top: 2px;
padding right: 7px;
padding bottom: 4px;
padding left: 10px;
} Só que podemos resumir todos os valores dados numa só linha:
.class{
padding: 2px 7px 4px 10px;
}A sequência sempre começa com o valor de top
Então, no exemplo que você deu:
padding: 20px 0;Quer dizer que o top o bottom estão recebendo o valor 20px , menos o right e o left que tá recebendo valor 0. Já nesse exemplo:
padding: 20pxRight, top, bottom e left, todos estão recebendo 20px.
Vê se completmenta o link: https://developer.mozilla.org/pt-BR/docs/Web/CSS/padding
Na hora que tava fazendo a resposta o Maheus postou. Fica as duas, rs