title: How to display multiple dynamic tables on webpage
body: <p>I have an SQL query which shows orders for customers.</p>
  
  <p>I have big screen in the office where I am showing the customers orders.</p>
  
  <p>I am using the boostrap table to show the orders. The problem is some orders have few line items than others. So, this creates a lot of space.</p>
  
  <p>This is how it looks like:</p>
  
  <p><a href="https://i.stack.imgur.com/TxYsI.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/TxYsI.png" alt="order board"></a></p>
  
  <p>I want to display orders so I don't get empty space. I want table to adjust them selves.</p>
  
  <p>I also want to view the layout in 4 different columns.</p>
  
  <p>So how to 4 columns of tables; the table can have a different number of rows but they all adjusted nicely so I don't get any white space.</p>
  
  <p>Here is my HTML for the table:</p>
  
  <pre><code> &lt;div class="table-responsive"&gt;
              &lt;table class="table table-sm"&gt;
                &lt;thead&gt;
                  &lt;tr&gt;
                    &lt;th scope="col"&gt;&lt;/th&gt;
                    &lt;th scope="col"&gt;&lt;/th&gt;
                    &lt;th scope="col"&gt;&lt;/th&gt;
                    &lt;th scope="col"&gt;&lt;/th&gt;
                    &lt;th scope="col"&gt;&lt;/th&gt;
                  &lt;/tr&gt;
                &lt;/thead&gt;
                &lt;tbody&gt;
                  &lt;tr&gt;
                    &lt;td&gt;&lt;?php echo $value["test"]?&gt;&lt;/td&gt;
                    &lt;td&gt;&lt;?php echo $value["test"]?&gt;&lt;/td&gt;
                    &lt;td&gt;&lt;?php echo $value["test"]?&gt;&lt;/td&gt;
                    &lt;td&gt;&lt;?php echo $value["test"]?&gt;&lt;/td&gt;
                    &lt;td&gt;&lt;?php echo $value["test"]?&gt;&lt;/td&gt;
                  &lt;/tr&gt;
                &lt;/tbody&gt;
              &lt;/table&gt;
  
            &lt;/div&gt;
  </code></pre>