我有一个 div,其中包含许多具有不同高度的内部 div,以便创建类似于 Facebook 时间轴的两列输出,有点像这样:
<div style="width:600px">
<div class="boxsample" style="float:right;width=50%;">Content-right-1</div>
<div class="boxsample" style="float:left;width=50%;">Content-left-1</div>
<div class="boxsample" style="float:left;width=50%;">Content-left-2</div>
<div class="boxsample" style="float:right;width=50%;">Content-right-3</div>
</div>
问题是,每当最后一个左边的 div 高于最后一个右边的 div 时,下一个 div 总是 float 到最后一个右边的 div 的左边,如下所示: http://postimage.org/image/fi5ndamk5/ 它似乎将右侧悬挂的 div 视为使其 float 到其左侧的约束。
如何确保 float:right div 始终正确 float ? (我正在做一个 while 循环来从数据库中获取内容,我想通过使用 float 来指定 div 所属的列,有点像在 Facebook 时间轴中。)
最佳答案
您可以使用 clear: right
与 float: right
div 和 clear: left
与 float: left
div。看这个JSFiddle供引用。
关于html - 如何确保所有 <div> 都带有 float :right; actually float right?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/11921577/