Ich habe zwei Tabellen auf einer Seite, die ich nebeneinander anzeigen möchte, und zentriere sie dann auf der Seite (eigentlich in einem anderen div, aber dies ist das einfachste, das ich mir einfallen lassen könnte):

<style>
  #outer { text-align: center; }
  #inner { text-align: left; margin: 0 auto; }
  .t { float: left; }
  table { border: 1px solid black; }
  #clearit { clear: left; }
</style>

<div id="outer">
  <p>Two tables, side by side, centered together within the page.</p>

  <div id="inner">
    <div class="t">
      <table>
        <tr><th>a</th><th>b</th></tr>
        <tr><td>1</td><td>2</td></tr>
        <tr><td>4</td><td>9</td></tr>
        <tr><td>16</td><td>25</td></tr>
      </table>
    </div>

    <div class="t">
      <table>
        <tr><th>a</th><th>b</th><th>c</th></tr>
        <tr><td>1</td><td>2</td><td>2</td></tr>
        <tr><td>3</td><td>5</td><td>15</td></tr>
        <tr><td>8</td><td>13</td><td>104</td></tr>
      </table>
    </div>

  </div>
  <div id="clearit">all done.</div>
</div>

Ich verstehe, dass es etwas mit der Tatsache zu tun hat, dass die Tabellen schwebend sind, aber ich kann nicht verstehen, was mir fehlt. Es gibt viele Webseiten, die so etwas wie die Technik beschreiben, die ich hier zeige, aber auf jeden Fall funktioniert es nicht. die tische klammern sich hartnäckig am linken rand.