title: How to deal with table overflow in semantic UI
body: <pre><code>&lt;div style="overflow-x: scroll"&gt;
     &lt;table class="ui table"&gt;
       ... table data ...
     &lt;/table&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>I have a table that has many columns and rows in it. It overflows off the page and I can only scroll horizontally when I reach the very bottom of the page/table. <br><br>
  <strong>How can I make it so that no matter how "tall" the table is, I can still be able to scroll horizontally at any point scrolling up and down on the table?</strong></p>
  
  <p>Edit: JSFiddle link to example is here: <a href="http://jsfiddle.net/2111sku5/" rel="noreferrer">http://jsfiddle.net/2111sku5/</a></p>
  
  <p>In the JSFiddle, you can see that you have to scroll all the way to the bottom of the table in order to scroll horizontally to see the rest of the headers.</p>