Por quê foi usado padding na classe produtos para afastar do topo e não um margin-top na tag main? Como eu sei quando usar um ou outro?
Por quê foi usado padding na classe produtos para afastar do topo e não um margin-top na tag main? Como eu sei quando usar um ou outro?
Oi Eric, a propriedade margin é utilizada para definir o espaço externo do elemento ( estende a área de borda com um espaço vazio utilizado para separar o elemento dos elementos vizinhos). Já o padding compreende o espaço entre o conteúdo do elemento e as suas bordas. Espero ter ajudado.
Sim, mas como eu sei quando usar um ou outro sendo que os 2 podem causar o mesmo efeito visualmente? Um espaço acima do elemento por exemplo.
Acho que despendendo do efeito que você quer dar ao elemento você pode escolher se vai utilizar as configurações no margin ou no padding ou em ambos. Visualmente os efeitos são diferentes, utilizando o padding você deixa o conteúdo mais afastado das bordas, em contrapartida o margin deixa a box mais separada visualmente em relação aos elementos do box-model externos a ela. No caso, pelo que entendi você quer adicionar um espaço acima do elemento, mas esse espaço acima (top) seria em relação as bordas da box ou em relação a elementos externos a box? No caso 1, é interessante utilizar o padding-top e no caso 2 utilizar o margin-top.
Olá amigo, tudo bem ? Essa dúvida é interessante, na teoria parece ser bem fácil, mas na prática não facilita muito o entendimento. Contudo, se o professor usasse o margin-top, ia ficar uma lacuna entre o o header a tela de cima no caso uma parte branca que é o fundo do body. Usando o padding, o espaçamento é interno e o header continua zerado na parte superior do navegador.
Pra facilitar o entendimento, seria bom testar as 2 opções e vc ira ve e perceber a diferença. Abraços.