Consider the following (applies to all IE6+ browsers -- including IE8):

<div id="picture">
   <div class="thumb" style="position: relative;"><img .. /></div>
   <p>Some description</p>
</div>

When I animate the opacity down to 0 it only works if I change the .thumb class to position: static. This has bigger problems because I use that to constrain absolutely positioned children to that container.

I've tried all the hacks I have discovered, none work (bg-color, zoom, etc).

You can see an example here: http://chovy.dyndns.org/test/opacity3.html

I need to use position: relative on the real world case throughout the container that is getting the animation.