防止浮动的div包装到下一行 [英] Prevent floated divs from wrapping to next line

问题描述

这是我的网站，首先：

www.kaiserroof.com/test/index2.html

这里是我的问题。您会注意到，在页面中间的分隔栏下方，有三列，一个带有表单，一个带有文本，一个带有链接。现在，将窗口调整为稍小，右边的div将下降到下一行。有没有反正只是不显示呢？所以，他们的div会调整（我有一个液体布局），直到他们不适合的点，然后，而不是将div包装到下一行，它只是不会显示？

So here is my problem. You'll notice that underneath the divider bar in the middle of the page, there are three columns, one with a form, one with text, one with links. Now, resize the window to slightly smaller, and the right div will drop down to the next line. Is there anyway to just not display that? So, they divs will adjust (i have a liquid layout) up to the point where they won't fit, then, instead of wrapping the div down to the next line, it just won't be displayed?

我希望这是有道理的。任何帮助将非常感激。

I hope this makes sense. Any help would be greatly appreciated.

推荐答案

你也可以实现与CSS只。

You can also achieve that with CSS only.

只需将以下CSS属性分配给＃row4：

Just assign the following CSS attributes to #row4:

#row4 {
    min-width:1202px; /* the exact value depends on the sum of the width of your 3 column boxes */
    overflow:hidden;
}

这与您的预期解决方案略有不同，因为正确的框将保持部分可见

This differs slightly from your intended solution, since the right box will stay partly visible when sizing down the window and will not immediately disappear completely.

请注意，min-width在IE6中不起作用。但是，如果您需要支持旧的IE，则有几种方法来模拟min-width属性：

Please be aware that min-width won't work in IE6. However, there are several ways to emulate the min-width property, if you need to support old IEs:

http://www.thecssninja.com/xhtml/ie6-min-width-solutions

这篇关于防止浮动的div包装到下一行的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！