Why Doesn't This Work

Hello,

The code below displays a div, that remains centered upon the browser window being resized. Why doesn't the div stretch the height of the window, upon entering the statement "HEIGHT: 100%;"?

Code:

---

Body
{
  MARGIN: 16px 0;
}

#Container
{
  WIDTH: 751px;
  HEIGHT: 100%;
  MARGIN: 0 auto;
  BORDER: 1px solid RGB(0,0,0);
}

---

#container is 100% of what? If you want it to be 100% of the body, its parent element, then you must give the dimensions of the body. But if you want the body to be 100% high then, same question. 100% of what? The body's parent is html, so html{height:100%}

See the faq on 100% height because it is unlikely that you want your container to be only 100% high. You more than likely will want it to be a minimum of 100%. The faq explains this :).