Question

我在另一个div里面有一个div。但是，由于内部div的边距和填充，每当您放大时，内部div最终会超出外部div的边界。如果不包括边距和填充，则不会发生这种情况。我想知道是否有办法使内部div永远不会超过外部div，无论内部div的边距和填充？

body {
width: 1000px;
}
#inner {
border: 1px solid black;
height: 90%;
margin: 2%;
padding: 2%;
}
#outer {
border: 1px solid black;
width: 50%;
height: 50%;
}

<body>
<div id = 'outer'>
<div id = 'inner'>
</div>
</div>
</body>

Answer 1

您需要在内部div上设置box-sizing: border-box，以便在宽度中包含边框/填充等。

实际上你也应该对外部div进行操作，而不是内部的边距，在外部设置填充，以确保所有内容都包含在宽度中。

在缩放时，带有边距和填充的内部div最终会超出外部div

1 个答案: