你好我有问题,我无法在网上找到一个很好的解释答案。
当我在第二个div中输入带有h1标签的文本时,我有两个div,它会将div推下来。即使我使保证金最高。
我的代码:
<!DOCTYPE html>
<html lang="nl">
<head>
<meta charset="UTF-8" />
<title></title>
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link href="css/normalize" rel="stylesheet" />
<style>
#one {
width: 100%;
height: 50px;
background-color: red
}
#two {
width: 100%;
height: 150px;
background-color: blue
}
h1 {
margin: 50px 0;
}
</style>
</head>
<body>
<div id="one">
</div>
<div id="two">
<h1>Hoi</h1>
</div>
</body>
</html>
答案 0 :(得分:2)
两个或多个(或父母和子女)框的相邻边距可以组合形成单个边距,这种组合称为折叠边距。
W3C参考:https://www.w3.org/TR/CSS2/box.html#collapsing-margins
任何溢出值与应用于父级的默认值(可见)不同都会阻止崩溃。
在div中使用overflow: hidden
#two将解决它。