Break element out of container

Question

I have all my content wrapped in a container element with a fixed width.

But I have a

that I want to \"break out\" of that container to span the

Answer 1

Building on top of voodoo417's solution with just adding a second wrapper and some slight modifications this can be done properly:

    .outer-wrapper {
        overflow:hidden;
        min-width:300px;
    }
    .wrapper {
        width:300px;
        margin:0 auto;
        background:yellow;
    }
    .break {
        text-align:center;
        font-weight:bold;
        background:rgba(255,0,0, 0.5);
        margin-left:-9999px;
        margin-right:-9999px;
    }

    

    

        
Ipsum Dapibus Pellentesque Pharetra
        
This should be full width
    
    

Here is the adapted jsfiddle:

http://jsfiddle.net/v53vv78d/2/