你好!这是一个问题:我有几个(最多 5 个)高度不同的 div。这些 div 内部是 portlet,它们的高度可以增加。这是一个简化的示例:
.clz {
float: left;
}
<div class="container">
<div class="clz">1111111111<br/>1111111111</div>
<div class="clz">2222222222<br/>2222222222<br/>2222222222</div>
<div class="clz">3333333333<br/>3333333333</div>
<div class="clz">4444444444<br/>4444444444</div>
</div>
Here是一个 JSFiddle,您可以在其中看到它。
当我减小浏览器窗口宽度时,div
被换行,这非常好。不好的部分是 4444444444
停留在 2222222
- 它不会落到页面的开头:
1111111 2222222 333333
1111111 2222222 333333
2222222 444444
444444
理想的行为是当 4444444
被放置在页面的开头完全不同的行时发生换行:
1111111 2222222 333333
1111111 2222222 333333
2222222
4444444
4444444
最佳答案
您可以为此使用display:inline-table。像这样写:
.clz{
display:inline-table;
}
检查这个http://jsfiddle.net/eGawU/13/
IE8及以上版本
关于html - 不同高度的 float div 在包装时卡住,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/12177567/