css layout problem

Seite 1 von 1 - Forum: Coding Stuff auf overclockers.at

URL: https://www.overclockers.at/coding-stuff/css_layout_problem_207906/page_1 - zur Vollversion wechseln!

Hallo, erstmal!

So nun zu meinem Problem. Hier eine kleine Übersicht:



Blauer,Grauer und Gelber Bereich werden mit Position absolut positioniert und der Rest definiert.

Problem gibt es bei den roten Bereichen.
Innerhalb des großen grauen Bereichs (Nennen wir ihn Content ) gibt es 1 bis n rote Bereiche diese sollen nebeneinander dargestellt werden.

Ist der Rote Bereich höher als der Graue so soll der Orange Scrollbalken (Y) im grauen Bereich erscheinen.

Sind zb. 2 Rote Bereiche breiter als der Graue so soll der Orange Scrollbalken (X) im grauen Bereich erscheinen.

In weiterer Folge werd ich mit Javascript abfangen wann gescrollt wird um damit mit Javascript auch im Blauen Bereich zu scroll.

Hoffe ihr versteht mein Problem.
Am besten wäre natürlich eine Lösung ohne Javascript aber mir fällt zurzeit leider nicht ein wie.

Im Blauen Bereich stehen Informationen die Abhängig davon sind was im Roten bereich steht. Scorll man jetzt im Grauen Bereich muss ich per Javascript automatisch auch den Blauen Bereich scrollen. Der blaue Bereich muss allerdings fixiert sein da er sich nicht bewegen soll wenn ich im Content die x-richtung scroll

klingt eh toll, woran scheiterts jetzt genau?
den blauen bereich kannst mit position:fixed fixieren, aber das wirdst eh selber auch wissen.

pack den blauen bereich auch in den grauen, dann scrollt der mit!
und für die x-richtung musst ihn fixieren. (wobei ich mir da grad ned sicher bin, ob das funktioniert)

und den grauen bereich machste mit overflow:scroll; scrollbar!

ja also grauer bereich wird mit overflow:auto
falls zb die roten divs eh nicht hoch und breit genug sind ist kein scroll erforderlich

der graue bereich ist position:absolute wie bekomm ich jetzt die roten nebeneinander hin?
irgendwie funkt das bei mir grad nicht obwohl das doch eigentlich simple sein sollte. probier grad mit float usw herum aber es passt nicht

eigentlich müsstest bei jeden roten nur float; left; und width: xxpx; eingeben

so habs mit tables gemacht

<problem gelöst>

Jaja, das leidige Thema mit mehreren Spalten und CSS. Vor allem wenns auch noch immer gleich hoch sein sollen.

Falls es dich doch noch interessiert, hier ein netter Artikel darüber: http://www.positioniseverything.net.../onetruelayout/

overclockers.at v4.thecommunity
© all rights reserved by overclockers.at 2000-2026