简体繁体 English

如何阻止文本环绕一些浮动 div？

[英]How can stop text wrapping around some floated divs?

原文 2010-07-15 18:58:08 5 1 html/ css/ css-float

I floated 3 images in div s in the middle of a long section of text.我在div的一长段文本中间浮动了 3 个图像。 I want to float them so the site keeps it's 'liquid' design, adapting to any width browser window.我想浮动它们，以便网站保持它的“流动”设计，适应任何宽度的浏览器窗口。 But if text starts wrapping to the left of them on wide Windows, it looks bad.但是，如果文本开始在宽窗口的左侧换行，则看起来很糟糕。 I'd like them to float, but still be able to clear text around them so they look like a block element.我希望它们浮动，但仍然能够清除它们周围的文本，使它们看起来像一个块元素。 How can I do that?我怎样才能做到这一点？

I thought maybe of sticking in a 100% width div right after the image div s, that's 1px high, and filled with a 1px image that's just the background color.我想可能会在图像div之后立即粘贴 100% 宽度的div ，即 1px 高，并填充 1px 图像，该图像只是背景颜色。 Will that work?那行得通吗？

http://www.briligg.com/frailty.html The images in question are the ones at the beginning of the 'the cause of addiction is stress' section. http://www.briligg.com/frailty.html有问题的图像是“成瘾的原因是压力”部分开头的图像。 Line 134 to 146, references the internal style sheet.第 134 到 146 行，引用内部样式表。

1 个解决方案

Put a clear: left on your section of text following the images.在图像后面的文本部分clear: left一个clear: left 。

That appears to be your div with class text though I don't know if you would want to universally apply the clear to all the divs with that class.这似乎是您的带有类text的div ，但我不知道您是否希望将clear普遍应用于该类的所有 div。