I've come across many inquiries on this subject, but the proposed solutions never seem to work when dealing with ancestors that have absolute positioning.
Take this example:
<div id='page'>
<div id='container' style="position:absolute; Overflow=hidden;">
<img style="position:absolute" src=.../>
</div>
</div>
In this scenario, I want the image to bypass the 'container's overflow. However, traditional methods like changing the container to relative position don't seem to be effective because of its absolute positioning. Are there any unconventional settings or clever workarounds to tackle this issue? Thanks for your help!
Just to provide some background, I'm creating a Chrome extension that overlays an image on top of existing images on web pages. But often, these inserted images end up being cropped by the parent elements with overflow styles (I'm aware I can insert them outside the parent with overflow style, but that solution brings about other complications).