4 column layout with custom width 4th column in bootstrap 3

Question

I'm developing a layout with bootstrap 3. It's a 4 column layout where the 4th one takes more width in the layout.

following is a mock-up of the layout.

How can I achieve this with bootstrap column structure?

Answer 1

Try like this:

 <div class="row">
 <div class="col-md-2 col-xs-2 col-lg-2">..</div>
 <div class="col-md-2 col-xs-2 col-lg-2">..</div>
 <div class="col-md-2 col-xs-2 col-lg-2">..</div>
 <div class="col-md-6 col-xs-6 col-lg-6">..</div>
</div>