Não consegui entender a lógica do padding com o exercício.

Olá Filipe,

o padding é um dos espaços que cada elemento tem. E no exercício é mostrado a varias formas de declara-lo.

Encare o elemento como se fosse uma caixa:

    padding-top: seria a parte de cima
    padding-right: seria parte direita
    padding-bottom: seria a parte de baixo
    padding-left: seria a parte esquerda;

Se declaramos:padding: 1px; será aplicado, nessa ordem, 1px na parte de cima, direita, baixo e esquerda, cada vez que aumentamos o padding imagine a caixa ficando mais gordinha de dentro para fora.

Att,

A ideia é que quando usamos apenas padding ela na verdade é um atalho para a escrita das 4 propriedades padding-top, padding-bottom, padding-left e padding-right.

Ele te fala que se você fizer padding com um valor só, ele assume esse mesmo valor para as 4 propriedades.

Aí ele quer saber: se você fizer padding com 2 valores qual valor ele vai usar em cada uma das 4 propriedades? E se usar com 3 valores? E com 4 valores?

padding é o deslocamento do texto em relação à sua caixa, fica mais facil de entender se vc colocar um fundo nesse elemento. A questão pede para vc completar os pads quando eles não são explicitamente citados, releia o texto que vc conseguira responder,

Em adição a tudo o que já foi dito, e não em substituição.

O padding é o espaço entre o elemento e a sua borda interna.

Depois vem a borda que o espaço entre o padding e o margem interna. E por fim a margin que é um espaço vazio entre os elementos.

Se você quiser visualizar isso claramente sem precisar ficar colocando diferentes cores de fundo em um elemento, basta apertar CRTL+SHIFT+I no google chrome que serão abertas as ferramentas de desenvolvimento do browser, clicanco em Computed e com o elemento selecionado você tem como ver claramente esses espaços, e isso ajuda muito!