IE css height problem 1

[duph]

I can't for the life of me figure out why IE wants to make my "container" box extra tall. I am aware that IE doesn't support max-height, so that doesn't help.

(I want the height of the container, the black background, to be ~600px so everything fits on smaller screens. Check out the site in Firefox for what i'm shooting for.)

i've been pouring over my css trying to find what is pushing the box down. Can anyone help me locate the problem?

http://www.storylinecorp.com

Thanks!

 

[Vragabond]

You will be happy to learn that IE7 now supports max-height and that it shows the page exactly the same as FF. And since IE7 is a critical update to IE6 it should replace the old browser swiftly.

Other than that, your page is not constructed normally. It uses the displacement (top, right, bottom, left) of the relatively positioned items. This works in a way that element is visually repositioned according to the values of top, left, right and bottom, however it still occupies its original space. Since IE6 does not support max-height, your container grows because of all the divs that are displaced.

To fix that, you should completely redo your page. You should get rid of displacement and work with floats instead.

 

[duph]

Thanks Vragabond. I should have realized that those things essentially have ghost-positions. I built the page this way because I was under the impression that float is so buggy in IE and others that it wasn't worth it. is that also now untrue?

thanks again,

 

[Vragabond]

I have used floats as a primary means for putting elements side by side and it has worked without problems in all the browsers. So I would say that statement is untrue.