How to make the web page height to fit screen height

Question

I need to make my web page height to fit the height of the screen size without scrolling   HTML   lt body gt       lt form id  form1  runat  server  gt       lt div id  main  gt           lt div id  content  gt            lt  div gt           lt div id  footer  gt            lt  div gt       lt  div gt       lt  form gt   lt  body gt    CSS   content  background-color  F3F3F3  margin auto width 70  height 700px    footer width 100  background-color  666666 height 200px

User · Answer

you can use css to set the body tag to these settings   body   padding 0px  margin 0px  width 100   height 100

User · Answer

A quick  non-elegant but working standalone solution with inline CSS and no jQuery requirements  AFAIK it works from IE9 too    lt body style  overflow hidden  margin 0  gt       lt form id  form1  runat  server  gt           lt div id  main  style  background-color red  gt               lt div id  content  gt                lt  div gt               lt div id  footer  gt                lt  div gt           lt  div gt       lt  form gt       lt script language  javascript  gt          function autoResizeDiv                         document getElementById  main   style height   window innerHeight   px                     window onresize   autoResizeDiv          autoResizeDiv         lt  script gt   lt  body gt

User · Answer

As another guy described here  all you need to do is add  height  100vh    to the style of whatever you need to fill the screen

User · Answer

Fixed positioning will do what you need    main                position fixed      top 0px      bottom 0px      left 0px      right 0px

User · Answer

Don t give exact heights  but relative ones  adding up to 100   For example      content  height  80       footer  height  20      Add in   html  body  height  100

User · Answer

Try    content  background-color  F3F3F3  margin auto width 70  height 77     footer width 100  background-color  666666 height 22       77  and 22  roughly preserves the proportions of content and footer and should not cause scrolling

[html] How to make the web page height to fit screen height

Examples related to html

Examples related to css