Fickle IE Issues with Height 100%
I am trying to set the height to 100% in the viewport for Internet Explorer. As you might imagine, the following code works everywhere else:
* {
margin: 0;
padding: 0;
}
html, body {
height: 100%;
}
body {
font-family: Times New Roman, Times, serif;
font-size: 13px;
background-color:#E8E8E8;
background:url(/images/background.png) repeat-x;
}
#wrap {
margin:0 auto;
width: 935px; /开发者_开发问答* Change to desired width :) */
min-height: 100%;
background:url(/images/content.png)repeat-y;
}
#main {
overflow: auto;
padding-bottom: 112px;
} /* must be same height as the footer */
I assume you have this HTML structure:
<html>
<body>
<div id="wrap"></div>
</body>
</html>
If so add min-height to the wrap div:
#wrap
{
min-height: 100%;
}
Note that this technique does not work on older IEs (when exactly it stops working below IE7 I am not sure) and it has unpredictable issue with Opera which has its own opinion on how to interpret height and min-height instructions.
加载中,请稍侯......
精彩评论