Question

Is there a way to do it?

If I do it like this:

<div id="container" style="width:500px;">
    <div id="content" style="position:absolute;width:100%;">
    </div>
</div>

Then the content div will have the width of the browser window, instead of the 500px from the parent container div.

Answer 1

Always give position:relative to the parent if it’s child have position:absolute;. Give position:relative to your #container DIV. Write like this:

<div id="container" style="width:500px;position:relative">
    <div id="content" style="position:absolute;width:100%;">
    </div>
</div>