Home/ Questions/Q 3300988
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-17T20:42:36+00:00

I have a div called content which I wish to at least take up

  • 0

I have a div called “content” which I wish to at least take up the entire height of a window.

So what I did was this:

body
{
   min-height:100%;
   height:auto !important;

   /* The following probably aren't relevant but I'll include them just in case */
   min-width:600px;
   color: #fff;
   font-family:'lucida grande',verdana,helvetica,arial,sans-serif;
   font-size:90%;
   margin: 0;
}
div#content
{
   min-height:100%;

   /* The following probably aren't relevant but I'll include them just in case */
   clear: both;
   color: #333;
   padding: 10px 20px 40px 20px;
   position:relative;
   background:url(/img/strawberry.png) right bottom no-repeat;
}

Using firebug, I verified that indeed is now taking up the entire page (even when there’s no content on the page. Just as I wanted)

However the problem is, content is not taking up the entire height of , but instead being only as large as its internal contents.

EDIT: Seems to work in chrome 7.0.517.41, but not in firefox 3.6.10 (problem seems to occur in all versions of firefox 3.6.x and probably previous versions as well).

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    I’ve already solved a similar problem with

    html,body {
    padding:0;
    margin:0;
    height:100%;
    min-height:100%;
}

    It seems <html> is sometimes taken into account to calculate height.

    • 0