Oi, sou novato em todo o quesito de web design e programação, estou terminando agora o conteúdo do primeiro curso de html e css. Sendo breve, tenho dúvidas entre os conceitos de espaçamento interno e externo, na hora de alterar o posicionamento na página web. Alguém poderia me ajuda a entender melhor?
hoje, com a Alura e o Google Gemini
Cara também estou aprendendo sobre isso. Mas penso o seguinte o "Margin" que é nosso espaçamento externo serve para separar de outro conteúdo ou outra "caixa" Já o padding alinha os elementos dentro da nossa caixa. Acho que vai um pouco de persistência para entender bem. Fiz esse dois códigos que serve para você dar uma olhada e tentar entender.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link rel="stylesheet" href="style.css" />
<title>Document</title>
</head>
<body>
<div id="margin">
<p>
Lorem ipsum dolor sit amet consectetur adipisicing elit. Quod labore sed
ipsa velit voluptates id magni aliquam, laborum eum iure assumenda
repudiandae reiciendis molestiae illo saepe ad officiis, quisquam ab.
</p>
</div>
<div id="margin2">
<p>
Lorem ipsum dolor sit amet consectetur adipisicing elit. Architecto hic
consequatur unde in qui minima recusandae explicabo eos voluptas velit
quam natus minus, suscipit accusantium laudantium culpa a eveniet
officiis.
</p>
</div>
</body>
</html>código css
body {
width: 400px;
}
#margin {
border: 1px solid red;
padding: 10px;
}
#margin2 {
border: 1px solid blue;
margin: 10px;
}
cópia e coloca no seu editor e vai alterando a margin e o padding para ver os resultados.
Valeuzão véi, ajudou bastante!