如何在右下方的文本中包装文本？

每当我尝试在CSS中做一些看似简单的事情时,它都行不通.

我有一个包含460x160图像的内容div.我想要做的就是将图像放在右下角并将文本环绕在它周围.

    
    text text text text text text ...

所以我希望它看起来像:

------------------
| text text text |
| text text text |
| text text -----|
| text text |    |
------------------

使用左上角或右上角图像进行操作是蛋糕:

#contents img { float:right; }

------------------
| text text |    |
| text text -----|
| text text text |
| text text text |
------------------

现在我该怎么把它推到底部？到目前为止,我提出的最好的是:

#contents img { float:right; margin-top: 90%} // really needs to be 100%-160px

------------------
| text text      |
| text text      |
| text text -----|
| text text |    |
------------------

在这种情况下,文本不会在边距中打印,因此图像上方有空白区域.

#contents { position:relative; }
#contents img { position:absolute; right:0; bottom:0; }

-or-

// move the img tag under the text in the html and:
#contents img { float:right; margin-top:-160; }

------------------
| text text text |
| text text text |
| text text -----|
| text text | te |
------------------

在这种情况下,文本打印在图像上方或下方.

那么......我怎么能做到这一点？

在(2003年),之前(2002年)或之前(2005年)似乎确实有人问过这个问题.

最后一个链接实际上建议使用基于javascript的解决方案,但对于固定(即非流动)解决方案.

然而,它与其他建议一致

唯一的方法是将浮动元素放在文本中间的某个位置.在所有的时间里都不可能完美.

或者这一个:

它包括浮动一个垂直的"推动器"元素(例如img,但它可能更聪明,只使用一个空div),然后使用clear属性浮动其下的所需对象.这种方法的主要问题是你仍然需要知道文本有多少行.它使事情变得更容易,并且绝对可以使用javascript编码,只需要将"推动器"的高度更改为容器的高度减去浮动的高度(假设您的容器未固定/最小高度) .

无论如何,正如本主题所讨论的,没有简单的解决方案......

Cletus在2003年的这篇评论中提到了这一点,它再次说明了它不容易实现的事实.
但是,它确实引用了这篇Eric Meyer的文章,这篇文章接近你想要实现的效果.

通过了解浮动和正常流如何相互关联,并了解如何使用清除来操纵浮动周围的正常流,作者可以使用浮动作为一个非常强大的布局工具.
因为浮动最初并不打算用于布局,所以可能需要一些黑客来使它们按预期运行.这可能涉及包含浮点数,"清除"元素或两者的组合的浮动元素.

然而,查德威克梅耶在暗示他的回答基于该解决方案 :beforeCSS选择器(变化伦纳德的答案).
它在这里工作.

嗯......这是一个非常古老的帖子,但我挣扎着用一个小的解决方法逃脱了.我需要将图像对齐到右边,并且距离顶部恰好是170像素.并且需要文本在图像的顶部,左侧和底部流动.所以我所做的是创建一个宽度为0px,高度为170px并向右浮动的.然后img将浮动并清除正确的瞧!

text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text
text text text text text text