Cards

Example

In a Bootstrap row, your columns need to add up to 12. Here are three cards in a row, each of which takes up 1/3 (4/12) of the row.

This takes up 1/3 of the row unless the screen is small, then it takes up the whole row.
This takes up 1/3 of the row unless the screen is small, then it takes up the whole row.
This takes up 1/3 of the row unless the screen is small, then it takes up the whole row.

HTML

<div class="row">
  <div class="panel col-xs-12 col-md-4">This takes up 1/3 of the row unless the screen is small,
then it takes up the whole row.</div>
  <div class="panel col-xs-12 col-md-4">This takes up 1/3 of the row unless the screen is small,
then it takes up the whole row.</div>
  <div class="panel col-xs-12 col-md-4">This takes up 1/3 of the row unless the screen is small,
then it takes up the whole row.</div>
</div>