CSS浮动权问题

Question

我有这个问题...我有一段文字，然后是一个按钮，我想要浮动：对，然后我有一个div只是一个边界......就像这样

TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT
<div style="float:right;">button</div>
<div class="dotline"></div>

我的问题是顺序是文字，虚线然后按钮，当它应该是文字，按钮和虚线时，我该如何解决这个问题？

这是dotline类的css

.dotline {
    border-top: 1px dotted #B0B0B0;
    height: 1px;
    margin: 10px 0;
}

Answer 1

清除浮动：

.dotline {
    border-top: 1px dotted #B0B0B0;
    height: 1px;
    margin: 10px 0;
    clear : both;
}

http://jsfiddle.net/y5pgd/

Answer 2

你可以剪掉按钮的浮动。

您可以添加clear：both到按钮

或在按钮后插入一个新的cleafix div。

无论如何，你应该停止按钮浮动以获得正确的顺序。