Make child div stretch across width of page

Question

Suppose I have the following HTML code:

<div id="container" style="width: 960px">    <div id="help_panel" style="width: 100%; margin: 0 auto;">      Content goes here.    </div>  </div> 

If I want the help_panel div to stretch across the width of the page/broswer, even if the width of the page/browser is wider than 960px (which is the width set for the container div), is it possible to do it with the above structure? I want to get the help panel div to expand beyond the width limits set in the container div if the page is wider than 960px.

I am curious if this can be accomplished with the above structure. Or will I have to put the help_panel div outside of the container div to make it work?

Thanks!

Answer 1

Yes it can be done. You need to use

position:absolute; left:0; right:0; 

Check working example at http://jsfiddle.net/bJbgJ/3/