Hallo,
ich lerne gerade Contao und versuche ein Layout mit folgenden Eigenschaften zu erstellen:
- Farbverlauf 1 auf dem kompletten Seiten-Hintergrund. Möglichst fixiert, so dass er nicht mit dem Inhalt mitscrollt(notfalls kann ich aber auch mit dem Scrollen leben)
- Sticky Header mit Abstand zum oberen Fenster-Rand und runden Ecken
- Zentriertes horizontales Menü im Header
- Sticky Footer mit Abstand zum unteren Fenster-Rand und runden Ecken
- Die Größe vom div "container" soll dynamisch den Platz zwischen Header und Footer einehmen und den äußeren Scrollbalken des Fensters bewegt
- Farbverlauf 2 auf dem Hintergrund vom div "container". Möglichst fixiert, so dass er nicht mit dem Inhalt mitscrollt(notfalls kann ich aber auch mit dem Scrollen leben)
- Links von der grünen Rahmenlinie auf der linken Seite sollte ein Schatten-Effekt zu sehen sein, allerdings nur so hoch wie der von Header und Footer umschlossene Bereich
Ich habe zum besseren Verständnis mein Chaos hochgeladen(Benutzername ist "test" und das Passwort ist "seite"):
http://highvoltage.bplaced.net/
Mit folgenden Punkten habe ich Probleme:
- Der div "container" wandert beim Runterscrollen durch den Bereich zwischen Header und oberem Fenster-Rand. Hier sollte eigentlich immer der rote Farbverlauf zu sehen sein
- Im Bereich zwischen Footer und dem unterem Fenster-Rand besteht dieses Problem ebenfalls
- Der vertikale Schatten-Effekt links neben der grünen Rahmenlinie geht unten über den Footer hinaus und wandert außerdem beim Scrollen mit
- Die Navigation wird durch die horizontale Zentrierung teilweise abgeschnitten
Lässt sich so ein Layout Browser-Übergreifend mit CSS und der Anpassung des Seiten-Templates bewerkstelligen?
Falls ja, bitte ich um ein paar konkrete Tipps, momentan fehlt mir da irgendwie der Ansatz
Es wäre sehr nett, wenn sich das mal jemand von euch ansehen könnte. Vielen Dank!
Schöne Grüße,
Fruchtig
Lesezeichen