问题
How to avoid 100% width non-responsive HTML layout collapse when window resize? I tried by removing viewport meta tag but not working..
回答1:
just give your body or a container div a set width or min width
<body>
<div style="min-width:1024px;" >
//put the rest of your html in here
</div>
</body>
回答2:
Assign a width
or max-width
in your CSS. For example:
<body>
<div id="myContent">Stuff</div>
</body>
then in your CSS:
#myContent {
margin:0 auto;
max-width:1024px;
}
The margin
property will apply a top and bottom margin of 0
, then automatically center the div
with auto
. If the browser screen is wider than 1024px, the webpage will not get any larger but will sit in the center of the browser. If it is below 2014, the width will stick to 100% and the content will wrap to fit on the screen.
If your site needs to work in IE6, be sure to specify width
instead of max-width
, as IE6 doesn't recognise max-width
and will just ignore it altogether. You can place this either in an IE-only stylesheet.
来源:https://stackoverflow.com/questions/24074235/100-width-non-responsive-html-layout-collapse-when-window-resize