CODEWITHSUNDEEP
twitter-bootstrap-3
Hidalgo
Hidalgo

Reputation: 941

Bootstrap 3 Form Responsiveness

The following fiddle shows a sample form that has 3 "columns", each column has a label and an input. http://jsfiddle.net/Hidalgo/GXT66/1/

   <div class="form-group">
     <label for="txtField1" class="col-sm-2 control-label">Caption 1:</label>
   <div class="col-sm-2">
      <input type="text" id="txtField1" name="txtField1" class="form-control" />
   </div>

When the screen is being reduced, all columns collapse into a vertical form (caption on top and input at the bottom). How can I (if possible) make the form response is such way that when the screen is reduced but not to a smart phone size, only the 3rd column is collapsed. So essentially the form would have 2 columns instead of 3. And then, further, when the screen is reduced to the smart phone size, all columns are collapsed to a vertical form.

Upvotes: 0

Views: 111

Answers (1)

Carol Skelly
Carol Skelly

Reputation: 362430

Use col-sm-3 and col-md-2...

http://www.bootply.com/116952

Upvotes: 1

Related Questions