views:

165

answers:

4

This problem is only in IE. Consider the following HTML:
<html>
<body>
<div style='position:absolute;left:1em;right:1em;top:1em;bottom:1em;overflow:auto;'> Put more than a full screen of text in here. It should create a scroll inside the div. In IE, it stretches the div out vertically.
</div>
</body>
</html>
If you put a ton of text in the div, IE will stretch the div out beyond the declared "bottom". I know what it is doing. It considers the bottom of the page to be the bottom of the page after all of the text has been rendered. I want bottom to be the bottom of the visible window. So, I want to have a div that is centered inside the window. Is there some retarded hack to make IE comprehend the basic concept of CSS?

A: 

When positioning something you don't supply a left and a right, top and bottom. You do one or the other. Also give the div a width and height.

I like this website for learning positioning

Galen
That doesn't answer the question. How can you make "bottom" refer to the window's bottom and not the virtual page's bottom in IE? In every other browser in the world, bottom is the window's bottom.
This is incorrect. See: http://www.alistapart.com/articles/conflictingabsolutepositions/
D_N
i didnt know that!
Galen
A: 

body: 100%;

div#id height: 100%;

Khan
A: 

You could try using a conditional comment to add overflow:auto; for IE only.

Dave Everitt
A: 

When using conflicting absolute positions don't forget the fix for IE6 under the 'Creating the exception for IE5 and IE6' header in that article.

D_N