title: How to make a responsive row with 3 cards in it with bootstrap?
body: <p>I have a 3 cards but when i put all three of them in a row its appears two cards and the other card under it... i want to put all three of them in one row and also i want it be responsive with other devices.
  i want it to show like the cards in this website( i don't mean the same shape, i mean in one row and responsive):
  <a href="https://linksfire.co/" rel="nofollow noreferrer">https://linksfire.co/</a>
  this is my code:</p>
  <pre class="lang-html prettyprint-override"><code>&lt;div class=&quot;container&quot;&gt;
      &lt;div class=&quot;row&quot;&gt;
           &lt;div class=&quot;col-sm-4 card&quot;&gt;1&lt;/div&gt;
           &lt;div class=&quot;col-sm-4 card&quot;&gt;2&lt;/div&gt;
           &lt;div class=&quot;col-sm-4 card&quot;&gt;3&lt;/div&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>