Top, right, bottom and left positioning

[Ornendil]

I have an element that I want to give an absolute position. I want the top border to be 160px from the top of the page, the right border 10px from the right, the bottom border 20px from the bottom and the left to be 160px from the left. In FF and Opera the following code did the trick:

#main			{position:absolute; top:160px; bottom:20px;	left:160px; right:10px; width:auto;  height:auto; z-index: 5; overflow:auto;}

But this doesn't do it for IE. When I have more text inside the element than the page can display, it doesn't scroll like it should, but gives me visible overflow instead. How can I fix this?The page in question:http://www.elvarhoi.com/ny/?go=tidenderPS: In Opera, I'm seeing a width-scrollbar even though I have set overflow to auto. Why is this?

[aspnetguy]

I don't think IE recognizes width:auto and height:auto that is why you get the visible overflow...IE doesn't know the width or height so technically it is not even overflow.I don't know if this article can help you fix this but I didn't find anything elsehttp://www.webcredible.co.uk/user-friendly...ss-tricks.shtml

[Ornendil]

I don't think IE recognizes width:auto and height:auto that is why you get the visible overflow...IE doesn't know the width or height so technically it is not even overflow.I don't know if this article can help you fix this but I didn't find anything elsehttp://www.webcredible.co.uk/user-friendly...ss-tricks.shtml

Thanks.I solved the problem. In a way. I added another container around the "#main" element. It doesn't really work as it should, but it's good enough for now, until MS fixes this issue. In IE, that container, which is 100% of the page's height will scroll when it has overflow and in FF and Opera it won't (cause it doesn't overflow).

#cont			{position:absolute;		 height:100%; width:100%; z-index: 0; overflow:auto;}#main			{position:absolute; top:160px; bottom:20px;	left:160px; right:10px; z-index: 0; overflow:auto;}