Yet another CSS alignment problem

[Michel V]

http://adecec.net/rencontrespolyphoniques.html

It looks OK in most browsers (except netscape 4 because of CSS2's min-width attribute), but at a resolution of less than 800*600, the box at the bottom has the other boxes over it
This is because I positionned the bottom box with absolute coordinates in pixels...

So, what I'd like to do is position the bottom box just under the upper boxes, like 20 pixels below. Is there a way for this ? (sorry if my question isn't that clear)

[Doug Baker]

A couple of comments, first:

1) Very nice design concept, very airy, seems like a perfect compliment to the outdoor photos of Corsica you have.

2) According to http://www.richinstyle.com/bugs/table.html, which includes CSS2 compatibility, min-width is only supported by Moz5. I have IE 5.5, and I end up getting overlap as I resize.


Given that, you may have more problems that you originally expected.

Here's my thought ... if you use a combination of absolute positioning for one of the top divs, use your margin property to position the other div and your bottom div, I think the bottom div would then be underneath at least one of your top boxes. If this seems reasonable, I would suggest you use your margin property on the div that will always have the greatest height. That would prevent the overlap.