Bootstrap grid with fixed wrapper – Prevent columns from stacking up

The sm,md,lg,etc.. cols wrap/stack responsively. Use the non-stacking col-xs-* class…

<div class="container">
  <div class="row">
    <div class="col-xs-4">.col-4</div>
    <div class="col-xs-4">.col-4</div>
    <div class="col-xs-4">.col-4</div>
  </div>
</div>

Demo: http://bootply.com/80085

EDIT: Bootstrap 4, the xs no longer needs to be specified..

<div class="container-fluid">
  <div class="row">
    <div class="col-4">.col-4</div>
    <div class="col-4">.col-4</div>
    <div class="col-4">.col-4</div>
  </div>
</div>

Related Contents:

  1. Meaning of numbers in “col-md-4″,” col-xs-1″, “col-lg-2” in Bootstrap
  2. Bootstrap Grid System new line does not look nice
  3. Center a column using Twitter Bootstrap 3
  4. What is the difference among col-lg-*, col-md-* and col-sm-* in Bootstrap?
  5. Bootstrap dropdown sub menu missing
  6. Order columns through Bootstrap4
  7. Bootstrap 3 fluid grid layout issues?
  8. Bootstrap 3 Navbar with Logo
  9. How to change the bootstrap primary color?
  10. Why did Bootstrap 3 switch to box-sizing: border-box?
  11. How to use particular CSS styles based on screen size / device
  12. Bootstrap: how to stack divs of different heights?
  13. Input widths on Bootstrap 3
  14. Bootstrap icons are loaded locally but not when online
  15. Right to Left support for Twitter Bootstrap 3
  16. Bootstrap 3 – Use more than 12 columns in a row
  17. Bootstrap xs columns wrap
  18. Changing the width of Bootstrap popover
  19. How to change btn color in Bootstrap
  20. Bootstrap 3 – desktop view on a mobile device
  21. Change the order of col-*-12 columns in Bootstrap using push/pull
  22. Centering the image in Bootstrap
  23. Nested rows with bootstrap grid system?
  24. Make column fixed position in bootstrap
  25. How to use vertical align in bootstrap
  26. Custom CSS being overridden by Bootstrap CSS
  27. How to add a search box with icon to the navbar in Bootstrap 3?
  28. Center a column using Twitter Bootstrap
  29. How to make Twitter Bootstrap menu dropdown on hover rather than click
  30. What is sr-only in Bootstrap 3?
  31. IE8 issue with Twitter Bootstrap 3
  32. Twitter Bootstrap 3 Sticky Footer
  33. Twitter Bootstrap 3, vertically center content [duplicate]
  34. How can I change the Bootstrap 4 navbar button icon color?
  35. How to overwrite styling in Twitter Bootstrap
  36. What do “flex” and “justify-content” achieve that “text-align” doesn’t?
  37. Get Two Columns with different background colours that extend to screen edge [duplicate]
  38. Remove gutter space for a specific div only
  39. How to style icon color, size, and shadow of Font Awesome Icons
  40. top nav bar blocking top content of the page
  41. How to set up fixed width for ?
  42. Twitter Bootstrap – add top space between rows
  43. Scrollable Menu with Bootstrap – Menu expanding its container when it should not
  44. Prevent flex item from exceeding parent height and make scroll bar work
  45. How to create the masonry effects with just bootstrap 3 grid system and css
  46. css framework for an app with existing stylesheet
  47. How can I change the order of Bootstrap columns?
  48. Bootstrap Center Navbar Items
  49. Set div height equal to screen size
  50. Same height column bootstrap 3 row responsive

Leave a Comment