Rudi Thiel
Rudi Thiel

Reputation: 2551

How to make div size to contents as screen size shrinks

So I have a div with class of row, and in it 4 col-md-3 divs, however when the screen size shrinks to the breakpoint at which the divs align under each other I want the parent div to also resize. How can I do this?

<div class="row">
 <div class="col-md-3">text</div>
 <div class="col-md-3">text</div>
 <div class="col-md-3">text</div>
 <div class="col-md-3">text</div>
</div>

Upvotes: 1

Views: 61

Answers (3)

M B Parvez
M B Parvez

Reputation: 816

Just do it:

<div class="row">
    <div class="col-md-3 col-xs-12">text</div>
    <div class="col-md-3 col-xs-12">text</div>
    <div class="col-md-3 col-xs-12">text</div>
    <div class="col-md-3 col-xs-12">text</div>
</div>

Upvotes: 0

Paulo Pereira
Paulo Pereira

Reputation: 1115

Try use class row-fluid instead of row.

Upvotes: 1

ScaisEdge
ScaisEdge

Reputation: 133370

Add you setting for xs sm too

  <div class="row">
   <div class="col-md-3  col-sm-3  col-xs-3">text</div>
   <div class="col-md-3  col-sm-3  col-xs-3">text</div>
   <div class="col-md-3  col-sm-3  col-xs-3">text</div>
   <div class="col-md-3  col-sm-3  col-xs-3">text</div>
  </div>

Upvotes: 1

Related Questions