Die typische Technik, um ein Layout mit fließender Breite zu erstellen, besteht darin, Ihren Hauptinhalt mit einer minimalen und maximalen Breite zu versehen und sicherzustellen, dass er mit verschiedenen Techniken in allen Browsern funktioniert.
Eine andere Möglichkeit besteht darin, Elementen auf Ihrer Seite eine absolute Positionierung relativ zum Browserfenster selbst zu geben. Zum Beispiel können Sie Elemente am unteren Rand der Seite „fixieren“
div#stickbottom {
position: absolute;
bottom: 0;
}Ebenso können Sie Elemente in jedem Bereich der Seite fixieren. Es wird noch interessanter, wenn Sie Elemente mit Prozentwerten positionieren. Zum Beispiel könnten Sie ein Element immer 10 % vom rechten Rand der Seite entfernt lassen mit
div #farright {
position: absolute;
right: 10%;
}Durch die Verwendung dieser Technik wächst und schrumpft dieser Abstand des „rechten Rands“, wenn der Benutzer das Browserfenster vergrößert und verkleinert. Dies kann einige coole Möglichkeiten und Interaktionen mit anderen Elementen ermöglichen. Sie können eine Beispielseite hier. ansehen.
Ich bin sicher, Sie werden schnell bemerken, dass dieses Beispiel stark auf PNG-Grafiken ohne Hacks setzt. Das wird in IE 6 mit vielen weißen Hintergründen schrecklich aussehen. Es ist nur als Illustration von Möglichkeiten gedacht, zögern Sie nicht, Ihre eigenen Hacks zu implementieren oder GIFs zu verwenden oder einfach keine Objekte zu verwenden, die Transparenz erfordern.
Keine Sorge, es sieht auch in Firefox scheiße aus.
Wow, mein erster echter Troll!
Keine Sorge – wir alle kriegen sie von Zeit zu Zeit.
Es sieht in Firefox tatsächlich nicht schlecht aus, aber wie bei jedem Browser, je mehr dynamisch platzierte Objekte Sie mit Prozentwerten haben, desto schlimmer wird das Update-Ruckeln. Firefox ist meiner Erfahrung nach oft am schlimmsten.
Mit Ihren Techniken, wenn sie angemessen und in Maßen eingesetzt werden, können sie jedoch erheblich helfen.
Und zum Protokoll: IE6 sollte in der Hölle schmoren. Es hätte ein obligatorisches Upgrade auf IE7 sein sollen. Ihn mit einem anständig aussehenden Design zu unterstützen, ist ein Albtraum. Das ist jedenfalls meine Meinung. :)
@BladedThoth: Danke, ich bin froh, dass jemand es zumindest als mäßig nützlich empfand =). Es war nur als Illustration einer Idee gedacht. Ich wollte große Objekte und nicht nur kleine Quadrate verwenden, damit man wirklich sieht, dass diese Technik potenziell für interessante fließende Layouts verwendet werden könnte.