• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

CSS Layout erstellen

Status
Für weitere Antworten geschlossen.

Luk.Online

Neues Mitglied
Hallo!

Ich würde gern ein CSS Layout, dass ca so aussieht wie MS Word.
Das bedeutet: der ganze viewport sollte der bereich website sein
<div id="website"> und innen (die seite auf der man im word schreibt) sollte <div id="content">.
Jetzt hätte ich gern, dass wenn man scrollt, der content scrollt und website fest ist. wenn man genug gescrollt hat, soll content oben aus dem bildschirm verschwinden... Wisst ih wie ich meine? ^^ Wie bei Word eben.

Wie kann ich das anstellen? Geht das überhaupt?

Vielen Dank! Lukas
 
danke erstmal.
hätte evntl noch eine idee.
einen unsichtbaren div erstellen mit overflow auto oder visible, der so groß ist wie die "word-seite" und innen noch einen div den man sehen kann, der sich beim scrollen auf und ab bewegt? müste man da margin-top einen anfangswert geben? geht das mit auto?
 
Die hat m.W. der IE dort standardmäßig. Unabhängig davon, ob sie benötigt wird oder nicht.
 
Stimmt, der IE hat die immer. Wenn sie nicht benötigt wird, ist sie nicht aktiviert/disabled. Gefallt mir fast besser, als beim FF oder anderen Browsern. Zumindest wenn man bei mittig ausgerichtetem Inhalt Webseiten mit unterschiedlich langem Inhalt hat. Bei nicht-IE-Browsern wackelt der Inhalt dann immer hin und her ;)

Gruß thuemmy
 
Stimmt, der IE hat die immer. Wenn sie nicht benötigt wird, ist sie nicht aktiviert/disabled. Gefallt mir fast besser, als beim FF oder anderen Browsern. Zumindest wenn man bei mittig ausgerichtetem Inhalt Webseiten mit unterschiedlich langem Inhalt hat. Bei nicht-IE-Browsern wackelt der Inhalt dann immer hin und her ;)

Gruß thuemmy

Dieses Problem des "Wackelns" lässt sich so beheben, indem man für die anderen Browser diese Scrollbar erzwingt.

PS OT: Danke für deinen GB-Eintrag, thuemmy :grin:
 
Das ist mal wieder ein toller Trick. Ich glaub ich hab da mal versuche mit height: 101%; gemacht, und das gefiel mir irgendwie nicht. aber mit 100$ und 'nem margin-bottom: 1px; das gefällt mir.

Gruß thuemmy

PS: OT Bitte, gern geschehen :D
 
Die Seite "läuft" bei mir (IE 7).

Ich persönlich hätte auf die Höhenbegrenzung verzichtet und anstelle der inneren Scrollbar dann die äußere Standardscrollbar verwendet. Finde ich irgendwie einfacher zu handhaben.

Falls du bei diesen Farben bleibst, dann ist gelb sehr schwer zu lesen. Die Farben lenken dann zu sehr vom Inhalt ab und der Leser muss sich dabei mehr konzentrieren, was ihm wiederum den Spaß an der Seite möglicherweise verdirbt. Schlichte Farben mit angenehmem Kontrast sind mir da lieber.
 
vllt. bastel ich das heute nochmal um, dass man außen scrollen kann.
die farben will ich eigentlich so behalten.
werde aber den schwarz-gelb-hintergrund (background.jpg) nochmal neu gestalten.
und da werde ich noch etwas mehr schwarz mit reinmischen.

danke für deine kritik
 
natürlich.... erst jetzt komm ich drauf - wegen scrollbar im IE...
Code:
html { overflow: auto; }
warum is mir das nicht gleich engefallen^^

so. habe alles mal etwas umgebaut.
wer findet bugs? wie siehts aus?

Luk.Online - Labor

danke schonmal!
 
O.O - Vielen Dank für den Hinweis...
ich lass mir was einfallen

EDIT: ich habe mal etwasrumprobiert. Es geht. Aus dem Grund: der eigentliche inhalt wird in einem div angezeigt, dem scrollbars zur verfügung stehen.
trotzdem ist das ein interessanter denkanastz....
 
Zuletzt bearbeitet:
So wie's momentan ist verschwindet der Inhalt bei kleinerem Fenster und lässt sich nicht scrollen.
Warum widmest du diesem Problem so viel Aufmerksamkeit?
Lass doch die Seite so lang werden wie sie ist und gib ihr - um den footer unten anzuorden - min-height von 100%: Footer immer unten anordnen
 
So wie's momentan ist verschwindet der Inhalt bei kleinerem Fenster und lässt sich nicht scrollen.
Warum widmest du diesem Problem so viel Aufmerksamkeit?
Lass doch die Seite so lang werden wie sie ist und gib ihr - um den footer unten anzuorden - min-height von 100%: Footer immer unten anordnen
sorry, das versteh ich jetzt nicht... wenn ich verkleiner, dann passt sich die breite automatisch an.
und für die höhe habe ich eine scrollbar am rechten rand...

du nicht??
 
die Scrollbar ist schon da (IE 7).
Allerdings wird sie bei zu kelinem Fenster nicht aktiv.
Offensichtlich weil body und #website ein "overflow: hidden" haben.
 
Status
Für weitere Antworten geschlossen.
Zurück
Oben