Question

我以为我理解花车，但似乎我没有。

我有一个div（#service-list），我已经向左浮动了，我之后又添加了另一个div（#social），也是左移。

正在发生的事情是，尽管有足够的空间容纳div，但是在被推到新线之后的第二个div。

#service-list{
width: 660px;
border-right: 1px solid #808080;
border-bottom: 1px solid #808080;
border-left: 1px solid #808080;
float: left;
padding: 15px 0 20px 15px;
margin: 0 0 0 25px;
clear: both;
}
#social{
width: 200px;
float: right;
clear: left;
border: #666 solid 1px;
}

以下是网址：http://s361608839.websitehome.co.uk/101d/tim/index.html

谢谢，添

Answer 1

删除

<div class="clearfix"></div>

clear: left;

中的#social

#social{
    width: 200px;
    float: right; /* You should better use float: left */
    border: #666 solid 1px;
}

Answer 2

在您希望浮动元素出现之前，您在许多地方使用clear会阻止它们正常浮动。通过执行以下操作，我能够实现此目的：

在DOM

#social

#services-list

从clear: both移除#services-list（否则不会浮动）

Answer 3

你在服务列表和社交用clear:both之间有一个明确的修复 - 所以自然不会浮动 - 清楚：在服务列表中左边也是错误的..

让浮动在CSS中正常工作

3 个答案: