CSS - Multicolumn mit Overflow - Festehende Spalte
Heinrich Mek
- css
0 Heinrich Mek0 josh
Guten Mittag SelfHTMLer,
ich möchte gerade ein mehrspaltiges Layout mithilfe dieses Artikels
http://aktuell.de.selfhtml.org/weblog/css-spaltenlayout#wunderwaffe-overflow
realisieren.
Das funktioniert mit overflow: hidden, max- und min-width bereits recht gut und die Workarounds (expressions etc) für den IE habe ich auch schon umgesetzt.
Nun habe ich folgendes Problem: Ich möchte eine der drei Spalten fix, sprich nicht-mitscrollend haben. Dazu dachte ich an position: fixed; aber dann zieht es mir die anderen Spalten einfach über diese drüber. Entsprechende margins zu setzen finde ich unschön, da ich dann wieder vom liquid-design wegkomme, da dann die spalten bei kleinem Viewport nicht untereinander angezeigt werden können ohne JavaScript.
Hat jemand eine Idee, wie ich eine Spalte feststehend bekomme und dennoch bei kleinem Viewport diese untereinander anzeigen lassen kann?
Gruß
Hallo,
oder ist dies nicht möglich?
Spalte 1 / Spalte 2
Spalte 1 ist left-gefloated mit overflow: hidden.
Spalte 2 ist mit overflow: hidden versehen und hat eine min-width.
Solange ich das ganze komplett scrollend habe (also Spalte 1 und 2) funktioniert das einwandfrei und ich erhalte bei zu kleinem Viewport die Spalte 2 unter Spalte 1 angezeigt.
Nun möchte ich aber Spalte 1 feststehend (also immer erreichbar) haben, daz u dachte ich an position: fixed für Spalte 1. Doch dann tritt wie erwähnt das Problem auf, dass es mir Spalte 2 einfach unter Spalte 1 schiebt. Mit margin-left für Spalte 2 möchte ich nicht arbeiten, da ich es sonst nichtmehr erreichen kann bei zu kleinem Viewport Spalte 2 unter Spalte 1 anzuzeigen.
Hat jemand eine Idee, wie man das Problem lösen könnte?
Gruß
Hallo,
Mit margin-left für Spalte 2 möchte ich nicht arbeiten, da ich es sonst nichtmehr erreichen kann bei zu kleinem Viewport Spalte 2 unter Spalte 1 anzuzeigen.
Das geht aber sowieso nicht, wenn Spalte 1 feststehend ist - wie willst du dann scrollen, ohne dass sich das eine unter das andere schiebt?
Du könntest allerdings beide Spalten "normal" anzeigen (also ohne position:fixed), und dann der zweiten overflow:auto geben. Damit hast du aber nur an der Seite der Spalte 2 eine Scrollleiste, nicht mehr am ganzen Fenster.
Gruß
Hallo,
aber wenn ich scrolle darf sich das ganze ja ruhig unter die Spalte schieben. Aber das Problem das ich habe ist, dass dann der seitliche Abstand sich nichtmehr an der Spalte 1 orientiert und somit Spalte 2 genau wie Spalte 1 ganz links am Fenster beginnt und ganz oben, diese also übereinander liegen. Ich möchte, dass Spalte 2 solange rechts neben Spalte 1 angezeigt wird, wie der Viewport und min-width das erlauben, dabei soll beim Scrollen Spalte 1 feststehen. Spalte 2 scrollt also neben Spalte 1 her.
Wenn der Viewport zu klein wird, wird Spalte 2 unter Spalte 1 angezeigt und scrollt beim scrollen unter Spalte 1 weg.
Aber dies scheint sich nicht wirklich realisieren zu lassen.
Da probiert man ein liquid-Design mit feststehender Navigation und muss kläglich scheitern.
Gruß