CSS float正确的问题

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类

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

Answer 1

清除浮动的CSS：

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

http://jsfiddle.net/y5pgd/

Answer 2

您可以剪切按钮的浮动。

您可以添加明确的：既能按钮

或插入按钮后，一个新的cleafix股利。

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