css div height 100% problem?

。_饼干妹妹 提交于 2019-12-10 10:48:46

问题


I would like a div to take all the screen height, that's why I found the following links:

  • http://www.webmasterworld.com/forum83/200.htm
  • http://www.thefutureoftheweb.com/blog/100-percent-height-interface

the tricks: make the container have a specified height, for example: body{height:100%} seems work fine, however, I found that: once you add some doctype claim, for example:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

It doesn't work, at least at Firefox 3.*, it doesn't work. Any suggestions?


回答1:


The following works for me in HTML 4.01 strict (from your second link). No vertical scroll bar is displayed, even if the body is very long. Does this work for you?

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
  <head>
    <style>
      html, body {
      /* get rid of default spacing on the edges */
      margin: 0;
      padding: 0;

      /* get rid of that 2px window border in Internet Explorer 6 */
      border: 0;

      /* fill the height of the browser */
      height: 100%;

      /* no more scroll bar */
      overflow: hidden;
    }
    </style>
  </head>
  <body>
    <div>
      many many lines of text
    </div>
  </body>
</html>


来源:https://stackoverflow.com/questions/1892052/css-div-height-100-problem

标签
易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!