html - 文本环绕 float 的 div 但边框和 不环绕

Question

我有一个 div 是 float: right它在父 div 中。有p元素也在同一个父 div 中，文本环绕 float: right div 正确。

但是，如果我设置 p元素有边框，或者做一个<hr /> , 边框不会在文本停止的地方停止，而是延伸到 float: right 后面分区

这是一个漂亮的 mspaint 描述:

注意黑色横线的绿色部分在 float div的后面。

如何获取边框或 <hr />或者任何与文本一样宽的东西，而不是在 div 后面？

Answer 1

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

http://jsfiddle.net/MvX62/

我使用 border-bottom而不是 <hr />标签，必须添加 overflow: hidden; .看看 fiddle ，我认为这比公认的解决方案更有用，因为您还可以在水平线上添加边距，并且与文本有相同的间隙。

此外，您不需要定义 z 值，也不需要任何技巧或解决方法。