美文网首页
div模块高度随内容自动增加,浮动对齐的方法

div模块高度随内容自动增加,浮动对齐的方法

作者: 前端小飞侠 | 来源:发表于2016-12-15 14:39 被阅读0次

简要说明:我们要让子模块无限循环下去,子模块里面的高度又是没有设定的,高度随内容的增加而增加,那么问题来了怎么才能让子模块浮动的时候对齐?

难点:第一排第一个标签里面的内容少,第一排末尾的标签里面的内容多,这样用float浮动是没有问题,但是当这个相反的时候,这样浮动的话,后面的模块就是自动添加到少的地方去,页面就乱了。

<style>

.d-con{overflow:hidden;}/*这里是父级*/

.d-detail{display:inline-block;vertical-align:top;}

/*这里是子级的浮动,我们不在用float*/

/*vertical-align:top;这个是表示上对齐,你也可以设置其他方向的*/

</style>

<div class="d-con">

     <div class="d-detail"></div>

     <div class="d-detail"></div>

</div>


好啦,写法就是这样,完全perfect!加油!

相关文章

网友评论

      本文标题:div模块高度随内容自动增加,浮动对齐的方法

      本文链接:https://www.haomeiwen.com/subject/teqgmttx.html