clear不起作用的情况

<style type="text/css">
    .first
    {
        width:100px;
        height:100px;
        border:1px solid red;
        float:left;
    }
    .second
    {
        width:100px;
        height:100px;
        border:1px solid blue;
        float:left;
        clear:right;
    }
    .third
    {
        width:100px;
        height:100px;
        border:1px solid green;
        float:left;
    }
</style>
</head>
<body>
    <div class="first"></div>
    <div class="second"></div>
    <div class="third"></div>
</body>
</html>

这里的第三个div并不会因为第二个div 的clear:right而另起一行。因为第二个div要清楚右浮动时,第三个div还没开始加载,所以,clear对它不起作用。

 

另外一个可能clear不起作用的原因:

当上面的第一个和第二个div使用绝对定位的情况下,即使第三个div设置了clear:both,他也不会另起一行,因为绝对定位已经独立于文档之外,不占用文档的空间,因而不会对其他元素产生影响。

posted @ 2014-03-15 21:11  Aby_  阅读(396)  评论(0)    收藏  举报