Vor Monaten bin ich auf einen Hinweis Eric Meyers auf Alex Robinsons In search of the One True Layout gestoßen. Meyer bezeichnet Alex Robinsons Methode CSS-Layouts zu definieren als "Layout-Revolution" und ersten zufriedenstellenden Versuch, mit CSS beliebige Grid-orientierte Layouts zu erzeugen, also mit Spalten und horizontal angeordneten Blöcken zu arbeiten.
Am Wochenende habe ich Robinsons Artikel zum ersten Mal gelesen. Die Methoden, die er vorschlägt, sind tatsächlich verblüffend simpel. Bei Kolumnen werden z.B. einfach float
s verwendet, deren Position durch einen negativen Wert für margin
festgelegt wird. Dadurch ist das Layout unabhängig von der Position des Abschnitts im Quelltext. Auch bei den übrigen Komponenten von Robinsons Layout-Konzept besteht das Hauptziel darin, das Layout konsequent vom Quelltext zu trennen. Der HTML-Autor kann so auf Markup verzichten kann, das nur aus gestalterischen Gründen eingefügt wird. Für ein Layout, das in allen gängigen Browsern funktioniert, braucht Robinson lediglich ein wrapper-div
und eine Klasse (vertical align
).
Robinsons Technik interessiert mich aus zwei Gründen: Ich hoffe, dass sie es leichter macht, HTML und CSS zu unterrichten, und ich möchte sie auch für Projekte verwenden. Zuerst zum Unterricht: