html - 将 <div> 元素强制放到 2 行上

标签 html css css-float

首先,感谢您花时间阅读本文。

从我记事起,我就一直在使用 HTML/CSS,但今天我遇到了一个完全难倒我的问题。

我有一个容器,其中有一定数量(假设是 8 个)动态创建的子 div。我希望容器将子项显示在两行上,即使它们水平溢出。

例如,

 ____________
|            |
|[1] [3] [5] | [7]
|[2] [4] [6] | [8]
|____________|

接下来我要使用JS来实现一个不错的滚动功能。

但是,目前我只能让它们显示在一行而不是两行,方法是将它们设置为:

display: inline-block;

或者使用相当标准的方式垂直滚动:

float: left;

对此的任何建议将不胜感激!

克里斯

最佳答案

将子元素放在行中。

.row { height:100px; overflow hidden;} // assuiming 100px is height of a child
.row > .children { height:100px; float:left;}

关于html - 将 <div> 元素强制放到 2 行上,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/8447838/

相关文章:

html - 无缘无故的空白

javascript - 如何使用带有自定义标题和内容 div 的 jQueryUI Accordion ?

javascript - CSS - 制作导航栏但它超出了部分

javascript - 如何替换jquery img click中的html代码

php - 复制网站的最佳方法

html - 更改浏览器宽度时,Bootstrap 2x2 面板不对齐

html - div 网格在 IE7 中显示不正确

CSS:带有正确附加组件的省略号应该始终可见

html - 样式引号

javascript - D3.js 中的可折叠树