Outer-Space
Tipps & Tricks zur Programmierung in HTML

Zentrierte Bereiche

Wurden Web-Inhalte früher schön brav am linken oberen Seitenrand plaziert (sozusagen die Standard-Einstellung), so sind heute viele Web-Seiten – optisch ansprechend – mittig auf dem Bildschirm zentriert.

Die häufig anzutreffende und einfachste Möglichkeit besteht in der Realisierung einer zentrierten Tabelle bzw. einer Tabelle mit Randspalten an beiden Seiten. Diese Variante versagt allerdings spätestens, wenn der Inhalt auch horizontal zentriert werden soll und die HTML-Definition eine Strict-Variante vorsieht.

Die sichere aber auch aufwändige Version besteht darin, einen zentrierten Bereich mittels CSS-Angaben zu programmieren. Ein in der Bildschirmmitte liegender Bereich kann beispielsweise wie folgt realisiert werden.

.center { position:absolute; left:50%; top:50%; 
.center { width:500px; margin-left:-220px; }
.center { height:400px; margin-top:-200px;  }