title: Horizontal table layout using CSS
body: <p>Instead of the usual vertical table data  layout something like this:</p>
  
  <p><a href="https://i.stack.imgur.com/CRWLn.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/CRWLn.jpg" alt="alt text"></a>
  </p>
  
  <p>I'd like to display it like this in css:</p>
  
  <p><a href="https://i.stack.imgur.com/UYqQX.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/UYqQX.jpg" alt="alt text"></a>
  </p>
  
  <p>Any ideas?</p>
  
  <p>My php/html code:</p>
  
  <pre><code>&lt;div class="center_div"&gt;
  &lt;table&gt;
  &lt;tr&gt;
  &lt;th&gt;Author&lt;/th&gt;
  &lt;th&gt;Quotes&lt;/th&gt;
  &lt;th&gt;Arabic&lt;/th&gt;
  &lt;th&gt;Reference&lt;/th&gt;
  &lt;/tr&gt;
      &lt;?php while ($row= mysql_fetch_array($result)) { ?&gt;
          &lt;tr&gt;
              &lt;td width="150"&gt;&lt;?php h($row['vAuthor']) ?&gt;&lt;/td&gt;
              &lt;td&gt;&lt;?php h($row['cQuotes']) ?&gt;&lt;/td&gt;
              &lt;td&gt;&lt;?php h($row['cArabic']) ?&gt;&lt;/td&gt;
              &lt;td&gt;&lt;?php h($row['vReference']) ?&gt;&lt;/td&gt;
          &lt;/tr&gt;
      &lt;?php } ?&gt;
  &lt;/table&gt;
  &lt;/div&gt;&lt;/div&gt;
  </code></pre>