Solucionado (ver solução)
Solucionado
(ver solução)
3
respostas

O que realmente o padding e o margin fazem com meu conteúdo?

Preciso confirmar algumas coisas: Margin: Espaçamento externo. Usabilidade: Quando quero ter espaço entre o meu elemento e o elemento que está ao redor. Padding: Espaçamento interno. Usabilidade: Quando quero delimitar um espaçamento interno entre o conteúdo do meu elemento e a caixa que fica ao redor dele.

Então quer dizer que se eu der um tamanho x pra um elemento, e determinar um padding o meu conteúdo irá diminuir de tamanho até alcançar o padding? Ou minha caixa aumenta a partir do tamanho do meu elemento mais o padding?

3 respostas
solução!

Eaí Gabriel, tudo bem?

Você está correto quanto a definição e a usabilidade, tanto do margin quanto do padding.

No que se refere à sua última dúvida, quando você determina um padding para um elemento de tamanho x, esse por sua vez irá aumentar para tamanho = x + padding, o que muitas vezes acaba até desformatando o elemento.

Em termos, se quisermos que uma box tenha um tamanho de 400px por 400px, e atribuímos um padding de 20px, definimos a box como 380px por 380px.

Espero que tenha sanado a sua dúvida! Do mais, a melhor coisa a se fazer é por isso em prática. :)

Fala, José! Entendi. Então no exemplo que você deu se fosse 400px e eu adicionasse um padding de 20px ele ficaria na realidade com 420px, mesmo que eu estivesse escrevendo no meu código que o meu box devesse ser de 400px correto?

Correto Gabriel! :D