CSS: How to have position:absolute div inside a position:relative div not be cropped by an overflow:hidden on a container

Question

I have 3 levels of div:

• (In green below) A top level div with overflow: hidden. This is because I want some con

Answer 1

If there is other content not being shown inside the outer-div (the green box), why not have that content wrapped inside another div, let's call it "content". Have overflow hidden on this new inner-div, but keep overflow visible on the green box.

The only catch is that you will then have to mess around to make sure that the content div doesn't interfere with the positioning of the red box, but it sounds like you should be able to fix that with little headache.