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
Min width in window resizing
提问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 最小宽度。