开发者

Fickle IE Issues with Height 100%

开发者 https://www.devze.com 2023-02-14 09:46 出处：网络

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:

相关专题：css internet-explorer

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.