html – 具有可折叠div的流布局,用于维护行结构

前端之家收集整理的这篇文章主要介绍了html – 具有可折叠div的流布局,用于维护行结构前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

我有一个用可折叠的div制作的流畅布局.当它们坍塌时,它们会在下面留下一个空的空间,它会被下一个div自动填充(它们都有浮动:左).然而,这看起来不太好,我想保持“行结构”而不会失去移动div的能力(当窗口变小时). JSFiddle here.

CSS片段:

.clickable {
     border: 1px dotted black;
     width: 200px;
     float: left;
     height:50px;
     margin-right:20px;
     margin-bottom:20px;
}

HTML片段:

有纯CSS解决方案吗?我不想乱用JavaScript.我知道我可以动态确定列数,然后将它们包装成“行”,但我还不愿意使用这个解决方案.

最佳答案
更改浮动:左侧显示:内联块.这是我对你的小提琴的唯一改变,似乎给你正在寻找的效果.

http://jsfiddle.net/GLf7m/2/

猜你在找的HTML相关文章