调整窗口大小时防止元素包装

Question

在调整窗口大小时,如何防止正方形包裹？

我希望方块保持在他们的位置,但每次我调整窗口大小时,它们都被推下并隐藏起来.

这个例子目前正在运行,但是使这成为可能的解决方案是荒谬的.

是否有"更清洁"的方式或如何让它看起来更专业？

我的JSFiddle示例

.content {
    width: 100000000px;
}

Answer 1

从父元素中删除position:absolute和overflow:hidden.

由于元素是inline-block,您可以white-space:nowrap用来防止它们包装.如果这不是预期的效果,请删除它.

jsFiddle例子

#container {
    width: 100%;
    height: 100px;
    white-space:nowrap;
}
.square {
    display: inline-block;
    width: 100px;
    height: 100px;
}