title: Is there a way to expand bootstrap card dynamically?
body: <p>So I have table inside bootstrap card:</p>
  <pre><code>&lt;div class=&quot;card col-5&quot;&gt;
    &lt;div class=&quot;card-body&quot;&gt;
  
      &lt;div class=&quot;table-view&quot;&gt;
        &lt;div class=&quot;box table fixed-table-body&quot;&gt;
  
        &lt;table id=&quot;request_data&quot;
        class=&quot;dataTable no-footer table  table-hover table-border&quot; role=&quot;grid&quot; style=&quot;overflow: visible;&quot;&gt;
          &lt;thead&gt;
          &lt;tr&gt;
            &lt;th&gt;1&lt;/th&gt;
            &lt;th&gt;2&lt;/th&gt;
            &lt;th&gt;3&lt;/th&gt;
            &lt;th&gt;4&lt;/th&gt;
            &lt;th&gt;5&lt;/th&gt;
          &lt;/tr&gt;
        &lt;/thead&gt;
     
        &lt;/table&gt;
        &lt;/div&gt;
        &lt;/div&gt;
  </code></pre>
  <p>The table fits into the card but when the screen is resized the table should fit into the card but it expands out, I tried writing <code>@media</code> QUERIES but nothing is working, if someone could please help out.
  Thankyou.</p>