title: Horizontal Scroll Table in Bootstrap/CSS
body: <p>How could I make it so that a table inside a container with its own width does not follow the width of the container and instead, retain the table's width when it's not inside the container. I have a very wide table that I want to fit inside a col-md-9 container and it displays bad because it squeezes the table to fit to the container. I have tried <code>min-width</code> for the table but it is not flexible as adding more columns to my table will squeeze it again. Would it be possible to make the table's width auto while not following the parent's width?</p>
  
  <pre><code>&lt;div class="col-md-9" style="overflow-x: auto"&gt;
      &lt;table class="table table-bordered" style="width:auto"&gt;
      &lt;tbody&gt;
          &lt;tr&gt;
            .... contents
          &lt;/tr&gt;
      &lt;tbody&gt;
      &lt;/table&gt;
  &lt;/div&gt;
  </code></pre>