internet explorer 8 - IE 8 absolute positioned element outside its parent clipping problem -

internet explorer 8 - IE 8 absolute positioned element outside its parent clipping problem -

i have absolute positioned div within absolute positioned div. kid div content much bigger parent can contain. design. need kid div spill out of parent. in every other browser except ie 8 (ie 7 looks ok, not sure) in ie8 part of kid out of parent clipped. there, not visible can verified ie developer tools. tried z-index, tried explicitly setting overflow:visible, no luck @ all.

update: found out problem caused filter defined in parent div this:

-ms-filter: "progid:dximagetransform.microsoft.gradient(startcolorstr=#66c6dea2,endcolorstr=#66c6dea2)";

anyone has thought how work around that?

i solved using http://stackoverflow.com/questions/2756851/how-do-i-stop-internet-explorers-propriety-gradient-filter-from-cutting-off-cont

my solution little modified, set empty div class "ie_rgba_fix" within container want transparent, add together css someplace ie specific , children not clip anymore overflow: hidden

/* ie8 rgb workaround */ div.ie_rgba_fix { position: absolute; z-index: -1; top: 0; left: 0; width: 100%; height: 100%; background-color: transparent; -ms-filter: "progid:dximagetransform.microsoft.gradient(startcolorstr=#66c6dea2,endcolorstr=#66c6dea2)"; }

internet-explorer-8 filter overflow css-position clipping