Create div height 100%, but page scroll bar should not appear

I am create a div with 100% height HTML

<div id="BottomShelf"><开发者_Go百科;/div>

CSS

#BottomShelf{ position:absolute; top:400px; left:0px; width:100%; height:100%;; background:#d4b7a0; z-index:1;}

There is a page scroll showing up on the page, but I need a page scroll (not div scroll) only when there is content. height:auto does not do the trick too.

I need the div to take the browser height irrespective to the height of the monitor.

try to set top: 400px; bottom: 0; instead of top: 400px; height: 100%;

EDIT: note that this might not work in IE6 (don't know about IE7)

The body tag has some default margin, so if you need a div to take the place as body, first set the body style to: margin: 0;

I tried creating a div with the following styles, and it seems to do what you want:

height: 100%;
overflow: auto;

overflow: auto will give the div a vertical scrollbar if the content exceeds the height.

Have you tryd the overflow:hidden; css style property?

Sorry it was overflow:hidden;