Fixierte Container in zentriertem Layout?
smart
- css
Hallo zusammen
Meine Frage richtet sich an die CSS-Profis in diesem Forum.
Mein Layout sieht so aus dass ein 770px breiter DIV-Container (id=page) zentriert auf der Seite dargestellt wird (margin: 0 auto)
In page sind drei weitere Container (top, content & bottom) So weit so gut.
Ich würde nun aber gern top & bottom dementsprechend fix positionieren (sprich das die nicht mitscrollen) also top im Fenster ganz oben und bottom ganz unten.
Wenn ich page, top & bottom als position:relative positioniere funktionierts insofern das alle Container dort sind wo ich sie haben will nur dass sie eben mitscrollen. Sobald ich top/bottom als fixed deklariere funktionierts nicht mehr.
Was mache ich falsch bzw wie macht mans richtig?
Bitte um Hilfe. Danke.
Mfg smart
Mein Layout sieht so aus dass ein 770px breiter DIV-Container (id=page) zentriert auf der Seite dargestellt wird (margin: 0 auto)
smart,
Nein, mein Fenster ist aber schmaler als 770px, da ist die Box nicht zentriert, sondern ragt raus.
So weit so gut.
Nein, das ist nicht gut. Ich scrolle sehr ungern horizontal. Andere auch nicht.
Sobald ich top/bottom als fixed deklariere funktionierts nicht mehr.
Aha.
Was mache ich falsch
Keine Fehlerbeschreibung, kein Link, kein Quelltext.
bzw wie macht mans richtig?
Fehlerbeschreibung, Link, Quelltext.
Live long and prosper,
Gunnar
Hallo Gunnar
mein Fenster ist aber schmaler als 770px, da ist die Box nicht zentriert, sondern ragt raus.
Nein, das ist nicht gut. Ich scrolle sehr ungern horizontal. Andere
auch nicht.
aufgrund der zukünfitgen Zielgruppe der Homepage kann ich davon ausgehen das es bei denen passt aber dies ist eine andere Sache über die ich jetzt nicht diskutieren möchte.
Fehlerbeschreibung, Link, Quelltext.
Also ich bin nicht auf der Suche nach einer Fehlerbehebung sondern nach einem Tipp wie man fixierte Bereiche innerhalb eines zentrierten Layouts erreichen kann.
Link zur Beispieldatei hab ich angegeben.
Zum Quelltext: da es sich um die Probedatei handelt ist der HTML & CSS Code noch nicht auf 2 Dateien getrennt, was natürlich sobald eine lösung gefunden wurde geschieht.
Mfg Martin
Hallo Martin,
Also ich bin nicht auf der Suche nach einer Fehlerbehebung sondern nach einem Tipp wie man fixierte Bereiche innerhalb eines zentrierten Layouts erreichen kann.
position:fixed; funktioniert zumindest beim modernen Browser.
"innerhalb eines zentrierten Layouts" müßtest du erläutern,
bezieht sich das auf einen gewünschten erkennbaren Effekt, eine
Verschachtelung, oder kann das betr. Element einfach fix am Browserand
kleben?
Zum Quelltext: da es sich um die Probedatei handelt ist der HTML & CSS Code noch nicht auf 2 Dateien getrennt, was natürlich sobald eine lösung gefunden wurde geschieht.
Da solltest du vorher schon im Head einen eigenen Stylebereich verwenden.
Warum darf eigentlich die von die gewünschte Lösung nicht unter dem Stichwort
"Fehlerbehebung" laufen?
Grüsse
Cyx23
Hallo Cyx23
position:fixed; funktioniert zumindest beim modernen Browser.
"innerhalb eines zentrierten Layouts" müßtest du erläutern,
bezieht sich das auf einen gewünschten erkennbaren Effekt, eine
Verschachtelung, oder kann das betr. Element einfach fix am Browserand
kleben?
Mit zentriertem Layout meine ich einen DIV Container welcher mit margin:0 auto "gestylt" - also auf der Seite zentriert dargestellt wird.
Und da sitzt auch das Problem diese Zentrierung passiert automatisch und wenn ich bei einen weiteren Container bei position:fixed einen bestimmten Wert eingebe orientiert sich dieser zusätzliche Container am Fenster und nicht am automatisch zentrierten DIV container.
In meinem Fall (www.most.at/csstest/test.php) soll oben das Bild und unten der braune balken fix stehen bleiben IM zentrierten DIV.
Warum darf eigentlich die von die gewünschte Lösung nicht unter dem Stichwort "Fehlerbehebung" laufen?
Bitte um Entschuldigung wenn ich damit falsch verstanden wurde. In meinen Augen handelt es sich eben nicht direkt um einen "Fehler" sondern um einen Wunsch etwas anders darzustellen als ich es derzeit im Stande bin.
Hoffe damit jetzt für klarheit gesorgt zu haben!?
Mfg smart
Hallo smart,
Mit zentriertem Layout meine ich einen DIV Container welcher mit margin:0 auto "gestylt" - also auf der Seite zentriert dargestellt wird.
Und da sitzt auch das Problem diese Zentrierung passiert automatisch und wenn ich bei einen weiteren Container bei position:fixed einen bestimmten Wert eingebe orientiert sich dieser zusätzliche Container am Fenster und nicht am automatisch zentrierten DIV container.In meinem Fall (www.most.at/csstest/test.php) soll oben das Bild und unten der braune balken fix stehen bleiben IM zentrierten DIV.
vielleicht kannst du wenn nicht dem Container selbst, dann doch dem jeweiligen Inhalt ähnliche
bzw. passende Eigenschaften zuweisen?
fixed bezieht sich wohl erstmal aufs Browserfenster, was ja auch passend ist weil das Fenster
scrollt (und nicht ein Div).
Grüsse
Cyx23