Html 窗口大小调整中的最小宽度

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/3802455/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-29 04:39:59  来源:igfitidea点击:

Min width in window resizing

htmlcsswindow-resize

提问by pAkY88

I have a webpage with a fluid layout with a 100% width.

我有一个具有 100% 宽度的流体布局的网页。

When I resize browser window the elements in the page overlap.

当我调整浏览器窗口的大小时,页面中的元素会重叠。

I would create an effect similar to this website http://bologna.bakeca.it/that when window is smaller than a fixed width stop resizing.

我会创建一个类似于这个网站http://bologna.bakeca.it/的效果,当窗口小于固定宽度时停止调整大小。

回答by Chinmayee G

You can set min-width property of CSS for body tag. Since this property is not supported by IE6, you can write like:

您可以为 body 标签设置 CSS 的 min-width 属性。由于 IE6 不支持此属性,您可以这样写:

body{
   min-width:1000px;        /* Suppose you want minimum width of 1000px */
   width: auto !important;  /* Firefox will set width as auto */
   width:1000px;            /* As IE6 ignores !important it will set width as 1000px; */
}

Or:

或者:

body{
   min-width:1000px; // Suppose you want minimum width of 1000px
   _width: expression( document.body.clientWidth > 1000 ? "1000px" : "auto" ); /* sets max-width for IE6 */
}

回答by DanMan

Well, you pretty much gave yourself the answer. In your CSS give the containing element a min-width. If you have to support IE6 you can use the min-width-trick:

嗯,你几乎给了自己答案。在你的 CSS 中,给包含元素一个最小宽度。如果您必须支持 IE6,您可以使用 min-width-trick:

#container {
    min-width:800px;
    width: auto !important;
    width:800px;
}

That will effectively give you 800px min-width in IE6 and any up-to-date browsers.

这将在 IE6 和任何最新浏览器中有效地为您提供 800px 最小宽度。