TableDance

1. Es soll auf möglichst vielen Browsern funktionieren,
2. es soll für möglichst viele Besucher sichtbar sein und
3. muss sich den Verhältnissen des Besuchers möglichst gut anpassen.

Da JavaScript nicht auf allen Browsern funktioniert und schon gar nicht von allen Besuchern toleriert wird, verbietet sich sein Einsatz.

Somit fällt DHTML wegen 1. und 2. weg.

Wie also können wir ein Objekt positionieren, ohne z.B. Layer zu verwenden? Die Antwort ist einfacher, als man zunächst vielleicht denkt: Tabellen.

Den von uns gewünschten Effekt der Zentrierung eines Objektes erreicht man genauer durch das Verschachteln zweier Tabellen, d.h. also, dass genauer die innere Tabelle auf dem Bildschirm zentriert wird samt Ihrem Inhalt. Diesen Effekt nennt man oft TableDance.

• Der Source
• Die Dokumentation
• Hinweise

Der Source

<table width="100%" height="100%" cellspacing="0" cellpadding=0 border="1">
<tr><td>
  <div align="center">
    <table border="1"><!-- die innere Tabelle START -->
      <tr><td>Dies erscheint in der Mitte</td></tr>
    </table><!-- die innere Tabelle ENDE -->
  </div>
</td></tr>
</table>

Die Dokumentation

Man erzeugt eine Tabelle, die sich über den gesamten sichtbaren Bereich erstreckt und aus genau einer Zelle besteht.

In dieser Zelle wird die innere Tabelle horizontal zentriert (durch das div) und vertikal zentriert (automatisch) dargestellt.

Sie sehen an der Kürze der Dokumentation und des Sources, dass es vollkommen einfach ist.

Es ist nicht immer notwendig, JavaScript, DHTML und was nicht sonst noch alles zu nehmen.

Hinweise

Möchte man natürlich nur ein Bild oder eine Textzeile zentrieren, kann man es gleich anstelle der inneren Tabelle angeben.

Man geht also genau so vor, als würde man normal zentrieren. Die äußere Tabelle führt durch ihre umfassende Höhe (height=100%) und aufgrund der Eigenschaft, Inhalte vertikal zu zentrieren, wenn es nicht anders genannt wird den Effekt.

Ohne Tricks und Tabellen können Sie mit CSS in Browsern positionieren, die CSS unterstützen.