a diferença entre padding: 20px 0; e padding: 20px;

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: 20px

Right, 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