CSS Kochbuch

9.2 Einspaltige Layouts

Problem

Es soll ein Layout erstellt werden, das eine Hauptspalte enthält, wie in Abbildung 9-1 gezeigt.

Abbildung 9-1. Eine einspaltige Seitendarstellung

Lösung

Weisen Sie dem linken und rechten Außenabstand des body-Elements Prozentwerte zu:

body {
 margin-left: 15%;
 margin-right: 15%;
}

Diskussion

Durch die Verwendung von Prozentwerten für den linken und rechten Außenabstand des Dokumentkörpers bleibt die Spaltenbreite flexibel, wodurch sich der Inhalt über die gesamte Breite des Browserfensters des Benutzers erstrecken kann.

Soll die Spalte eine feste Breite erhalten, definieren Sie den Wert der Eigenschaft width für das Element ...