Making div extend outside of container to fit full screen width (bootstrap)

Question

I have a div inside a container that I wish to extend beyond the container to fit the screen width. I'm using bootstrap columns to create the divs.

<div class="container">
    <div class="row">
        <div class="col-md-12">
            <div class="mydiv">
                Content
            </div>
        </div>
    </div>
</div>

The container has a set width however that only fills about 1200px and mydiv can't extend beyond that.

We need to see CSS in order to tell what other restrictions we're working with! — Gershom Maes, Dec 21 '15 at 18:28
Turns out a div before that was being terminated prematurely. After fixing this the issue was resolved. — Matt, Dec 21 '15 at 18:49
This question needs re-opening as it's about Bootstrap and the cited duplicate isn't. — Adrian Thompson Phillips, Jan 04 '16 at 16:16

score 2 · Answer 1 · answered Dec 21 '15 at 18:28

2

You can make the inner div have a position:absolute unless its parent has a position:relative.

Or you could use negative margins on your inner div.

answered Dec 21 '15 at 18:28

Jared

310
1
9

Making div extend outside of container to fit full screen width (bootstrap)

1 Answers1