Css 为什么固定间距、固定宽度列的内联块属性引入滚动条

我读过关于如何基本上不可能有固定的列高、固定的列宽和固定的列间距（，）的问题

例如，在中，您可以在更改结果窗口的宽度时看到间隙的变化

但是，通过将列容器的“display”CSS属性设置为“inline block”，我似乎已经实现了固定的列高度/宽度/间距：

#column {
    column-width: 360px;
    column-gap: 100px;
    -webkit-column-width: 360px;
    -webkit-column-gap: 100px;
    white-space: normal;
    display: inline-block;
    margin-bottom: 30px;
    height: 600px;
}

-改变窗口大小时，间距不再改变，但现在有一个巨大的垂直滚动条！我的直觉是，这个垂直空间表示如果图像位于一个巨大的列中，它们将占用的空间，因为删除图像实际上缩短了垂直空间的数量（滚动条的长度）

为什么将“显示”设置为“内联块”会改变列间距行为

为什么内联块属性引入了如此多的垂直空间

我只是在Chrome中看到了超长的滚动条，而不是在IE11中

简单的答案是：您正在更改块元素的显示属性，使其行为类似于内联块，因此其行为将随之改变。您可以检查每个显示属性的行为

之所以创建巨大的竖条，是因为

#列

容器高度试图容纳其中的元素，而不管这些元素实际如何显示。放置一个

浮点：左#container

div的code>将修复此问题