Skip to content Skip to sidebar Skip to footer

Bootstrap - Container-fluid With Two Columns. Right Side Needs To Be Confined

I need a section in bootstrap where there are two columns (6 and 6) in a row. The left 6 column div needs to have the fluid effect where its contains stretch to the browser window'

Solution 1:

This is for 1170px wide container, you need media queries for the rest of the sizes. Hopefully helps.

CSS:

.stretch-left {
    margin-left: calc((100vw - 1170px) / -2);
}

HTML:

<divclass="container"><divclass="row"><divclass="col-md-6 stretch-left">
            content
        </div><divclass="col-md-6">
            content
        </div></div></div>

Post a Comment for "Bootstrap - Container-fluid With Two Columns. Right Side Needs To Be Confined"