[html] How to create a 100% screen width div inside a container in bootstrap?

Let's say i have the following markup:

<div class="container">
    <div class="row">
        <div class="col-md-12">
            ...
            <div class="full-width-div">
            </div>
        </div>
    </div>
</div>

Now how to make .full-width-div stretch to the full width of the screen? Because currently it's limited inside the container.

You should use container-fluid, not container. See example: http://www.bootply.com/onAFpJcslS

The reason why your full-width-div doesn't stretch 100% to your screen it's because of its parent "container" which occupies only about 80% of the screen.

If you want to make it stretch 100% to the screen either you make the "full-width-div" position fixed or use the "container-fluid" class instead of "container".

see Bootstrap 3 docs: http://getbootstrap.com/css/#grid