Hi,

I have a website that is using what I call dynamic content/hidden divs. For example, when you click a checkbox another div pops down.

The problem I'm having is that in IE6 (Firefox/IE7/Opera etc are fine) the absolute positioning does not move after a hidden div is shown. This is an issue as I have some classes that have a background image to provide a gradient border effect. The classes are absolute positioned at the bottom of the page as follows:

.contentarea .lbb { background: url(../images/wrapper/content_borderlb.gif); position: absolute; bottom: 34px; height: 134px; left: 0; } /*for the left gradient border*/

.contentarea .rbb { background: url(../images/wrapper/content_borderrb.gif); position: absolute; bottom: 34px; height: 134px; right: 0px; width: 5px;} */for the right gradient border*/

When you expand the DIV in IE, the page expands, but those absolute positioned divs stay in exactly the same place! The result can be seen in this comparison screen shot (the problem issue is hilighted with an arrow):
http://joshsphotos.com/absolute/comparison.gif

Does anyone have any suggestions?

FYI, the page is available here so you can see yourself. If you test it on Firefox/IE7 vs IE6 you should see what I'm talking about:

http://joshsphotos.com/absolute/star...withicons.html
http://joshsphotos.com/absolute/css/style.css

Thanks!
Josh

So, you're putting an absolutely positioned div INSIDE another absolutely positioned div ?? You're just asking for trouble with that layout, especially with IE.

You might want to read this: http://www.positioniseverything.net/posbugs.html

maybe is cause your are setting the bottom? or try background-repet: and background-position, it seems to me that when you expand it the bottom is still set to 34px and you are expaning from that 34 down.

Hope you understand my point