Can you create one div to flow over others like in the image below?

black is the browser window in the image bellow. I want to accomplish the image in th开发者_JAVA百科e right I have a div which is centered (blue) and has a fixed width I have a div which is inside (red)

I want the red div to span from one side of the screen to the other while still aligning all else in the center.

How should I do this? Should I break it in 3 divs(first fixed and centered, the second to span all width, the third like the first)

Here's an example of how to do it if you want the red div on top. If it's behind the blue, then put it first in the markup and you don't need the third div: http://jsfiddle.net/mGnpr/2/

Well, you answered your own question. I suggest you break it in 3 divs. Seeing how HTML elements function, it's pretty hard to 3-dimensionally stack them ( and making it look good :).

Write two classes in your CSS file: one with the fixed width and second with the "100%" width. Use the first class for top and bottom divs, the latter class for the middle div.