Html 拉伸容器以适合CSS列

我对CSS

columns

属性有问题。也就是说，我似乎无法让它们周围的容器延伸到柱的宽度，如图所示：

看起来很像浮动的类似问题，只是水平而不是垂直，但是伪元素clearfix对这个问题没有帮助

如何使容器完全包装列

---

另外，我知道这件事，但这只是一种好奇。我不关心从示例中实现布局。我很关心为什么容器没有拉伸来包装它的内容。

元素的绝对位置导致浏览器在使用

columns

属性时错误地计算它应该有多宽。删除它，元素将按其应该的方式拉伸。

能否将演示问题的代码直接发布到此问题中？在某些情况下，当您使用列时，某些浏览器很难计算元素的正确宽度（请参见此问题：）。绝对定位就是在这个特殊情况下打破它的原因。@cimmanon就是这样！非常感谢。如果你把这个写下来作为答案，我很乐意接受它=）