OesterBlog

Nach einem Tag bei der Familie musst ich noch etwas Sinnvolles machen. ;) Darum hab ich mich wenige Minuten hingesetzt und das Multi-Column-Design ausprobiert, das seit Firefox 1.5 mit CSS3 möglich ist.

• W3C: CSS3 module: Multi-column layout
• Mozilla Developer Center: CSS3 Columns
• Robert O’Callahan – Gecko 1.8 For Web Developers: Columns
• Multi-column layout extension
• A List Apart-Artikel: Introducing the CSS3 Multi-Column Module

Die Hexerei ist einfach und schnell geschrieben:
.multicolumn {
-moz-column-width: 21em;
-moz-column-gap: 2em;
-moz-column-rule: thin solid #CADEE9;
}

Das Ergebnis sehen bereits alle mit diesem Artikel, die Firefox 1.5 und nachfolgende Entwicklerversionen benutzen. Mit Spalten sind nun die Beiträge auf der Startseite, die Archive sowie die Einzelansichten von Beiträgen ausgestattet. :) Für MSIE-Nutzer werde ich keinen Screenshot zur Verfügung stellen.

Der einzige Wermutstropfen bei der Geschichte ist, dass column-rule noch nicht implementiert ist. (Den Befehl dafür lasse ich trotzdem drin.) Vielleicht wird’s was mit Firefox 3.0 nächstes Jahr.

Einen Bug beim Darstellen von <blockquote> habe ich bereits gefunden. Außerdem habe ich das Problem mit den Bildern innerhalb der Beiträge nicht bedacht, die meist Breiten von 400 Pixeln haben und dementsprechend weit über die Spalten hinausragen, und dass man nun bei überlangen Beiträgen scrollen muss, um von einem Spaltenende zum nächsten Spaltenanfang zu gelangen. Aber ansonsten bin ich ganz zufrieden damit. Mal sehen, wie lange ich es so belasse.

PS: Ich hoffe auf baldiges Erscheinen von W3C-Empfehlungen zu CSS3 Advanced Layout Module und CSS3 module: Multi-column layout, damit Webentwickler endlich richtige CSS-Werkzeuge in die Hand bekommen, um Layouttabellen endgültig den Garaus zu machen.