Hilarious schrieb:
Sei bitte so lieb, und versorge uns mit einer Quelle/Link. Danke!
Soweit ich mich erinnern kann hat er seinen Ansatz erstmal öffentlich Ende 2003 / Anfang 2004 bei spotleid.de im Forum vorgestellt. Es gab damals die Diskussion Liquid Design versus Absolut Positioning, zwischem ihm und Prefix.
Prefix war Befürworter des Liquid-Ansatzes. Den dort vorgestellten Lösungansatz, der hier gleich kurz dargestellt wird, hat sich Lars im Jahr 2003 ausgedacht.
Der Trick ist erstens als Basis den Absolut-Positioning-Ansatz zu nehmen anstatt den Liquid-Ansatz. Innerhalb des Absolut-Positioning-Ansatzes kann man wenn man will dann auch wieder Teile liquid machen.
Statt also einen Dokumentenfluß zu haben, ähnlich wie Word, wird voll auf Boxen gesetzt, die man beliebig positioneren kann, das ähnelt dann schon der Denk- und Arbeitsweise von Photoshop/InDesign/Quark - ein Layout-Ansatz eben. (Das dürfte allen Designer die aus der Print-Ecke kommen das Herz aufgehen lassen.)
Damit ist man dann schon einmal die ganzen Probleme mit dem CSS-Floating los, wozu die allermeisten CSS-Hacks da sind.
Um die Seite nun auch gegen den Box-Modul-Bug robust zu machen geht man wie folgt vor. Beim falsch implementieren Box-Model vom IE 5.0 (was anfangs auch von Opera übernommen wurde), ist das Problem, dass Angaben bzgl Padding und Border zur Größe der Box dazugerechnet werden.
Der erste Lösungsansatz ist diese Angaben zu vermeiden, allerdings will man oft nicht darauf verzichten. Der Trick ist nun zwei Boxen zu schachteln, die äußere bekommt die Angaben bzgl Weite und bei Bedarf auch der Höhe. In der inneren Box (die erstmal mit der äußeren identisch ist) kann man nun Padding, Margin und Border verwenden.
Das hat erstmals den kleinen Nachteil, dass ein paar Boxen mehr gesetzt werden müssen, allerdings kann man dann auch global und zentral für die innere Box ein Padding für den Text setzen, was die Wartung der Seite dann vereinfacht. Von daher ist es kein reiner Workaround sondern bringt auch einen Benefit.
Ist die ganze Seite nach dem Absolut-Positioning-Ansatz gebaut und benutzt man seinen Trick mit den zwei Boxen (da wo es nötig ist), erübrigt es sich fast völlig die Seite mit diversen Browsern zu testen.
Die Zeit als man Stunden und Tage damit zubringen mußte die Seite auf unzähligen Browsern zu testen und unzählige CSS-Hacks einzubauen ist damit vorbei. Und der Code ist Standard-Konform.
Es lohnt sich absolut so vorzugehen. Eure Projekte werden schneller fertig, ihr könnt günstiger produzieren und habt mehr Freizeit.
Lars hat 2003 noch ein paar weitere Lösungen entwickelt, darunter auch ein Cross-Browser JavaScript mit dem sich Ebenen ein- und ausblenden lassen (DOM), damit ist dann ein Content-Fokusierter-Ansatz möglich womit man auf scrollen verzichten kann. Weiterhin auch ein JS mit dem sich Angaben von Positionen korrigieren lassen (DOM), falls man z.B. einen Spaltensatz benutzt der in der Höhe liquid ist und noch ein Footer drunter soll.
Falls man ein Layout hat, bei dem ein Teil in der Breite variabel sein soll, je nach Fenstergröße, kann man dies damit auch lösen.
Der Einsatz von JS sollte unproblematisch sein, da 99,95% aller UAs dies aktiviert haben, die restlichen 0,05% sind Suchmaschinen. Denen ist die Darstellung egal und an die Inhalte kommen sie ran.
Für die INFO bekomme ich aber jetzt den MacUser-Pokal
Edit: Ein Wort im Satzbau vergessen und nachgereicht
