需要解释为什么向 div 添加内容会使其改变位置

Question

我有 3 个div 并排放置。当我尝试将标题(或任何元素(放在中间div(或任何div(内时，该div 会向下浮动。它为什么要这样做？ 我用于div 的 CSS：

div {
display: inline-block;
background-color: lightgray;
height: 600px;
width: 300px;
}

Answer 1

将*{box-sizing:border-box}添加到您的 CSS 中。它定义如何计算元素的宽度和高度。