Even spaces between bootstrap columns

Vote count:

0

Using this markup...

<div class="container-fluid">

    <div class="row">

        <div class="col-md-3">
            <div style="background-color:gray">1</div>
        </div>

        <div class="col-md-6">
            <div style="background-color:gray">2</div>
        </div>

        <div class="col-md-3">
            <div style="background-color:gray">3</div>
        </div>

    </div>
</div>

Here's a jsfiddle (run it in full screen): http://ift.tt/1jgObiP

Here's a screenshot:

The spacing between the divs at the red arrows are double of the space of the divs at the orange arrows.

How can I make the div space at the red arrow the same space (10px) as at the orange arrows and still maintain aligned divs/blocks when the three divs wraps as the browser window becomes smaller?

asked 1 min ago

MojoDK

1,019