文本环绕浮动div但边框和<hr /> s不包含

Question

我有一个div,float: right它在父div中.p同一个父div中也有元素,文本float: right正确地包围div.但是,如果我将p元素设置为具有边框,或者执行a <hr />,则边框不会停止文本停止的位置,而是延伸到float: rightdiv 后面.

这是一个美丽的mspaint描述的情况:

请注意,黑色水平线的绿色部分位于浮动div的后面.

我如何获得边界或<hr />其他任何东西只能与文本一样宽,而不是在div后面？

Answer 1

我知道这个问题是前一段时间发布的,但我今天遇到了同样的问题并找到了另一个解决方案:

http://jsfiddle.net/MvX62/

我用border-bottom而不是<hr />标签,不得不添加一个overflow: hidden;.看看小提琴,我认为这比接受的解决方案更有用,因为你也可以在水平线上添加一个边距,并且与文本有相同的间隙.

此外,您不需要定义z值,也不需要任何hacks或变通方法.