Frage stellenIch möchte links und rechts des Seiteninhalts ein Hintergrundbild haben und zerbreche mir seit Tagen den Kopf, wie sich das in der Art bewerkstelligen lässt.
Das Problem ist, dass der Bezugspunkt für das linke Hintergrundbild nicht der BIldschirmrand sondern der linke Rand des Inhalts (der ist zentriert) sein soll und umgekehrt für das rechte Bild.
Es ist etwas schwierig, das so zu erklären. Vielleicht versteht man es mit einem Beispiel besser. Das ist die URL zum linken Hintergrundbild: "u.jimdo.com/www30/o/s9ae4969a4b031997/userlayout/img/hg-rebelinks.jpg?t=1315227141" mit http vordran. Ich möchte also, wenn das Browserfenster kleiner wird, dass sich nicht der Inhalt von rechts über das Bild schiebt, sondern das Bild soll links vom Browser abgeschnitten werden. Im Anhang noch ein Bild davon, wie die ganze Seite am Ende aussehen soll.
Ausserdem soll das rechte Hintergrundbild erst am Seitenende platziert werden. Also quasi wie ein Footer. Aber das wollte mir nicht gelingen. Irgendwie muss ich das Div mit dem Bild ja mit dem Seiteninhalt verbinden, damit es die Länge der Seite weiss. Es soll aber hinter und neben dem Seiteninhalt stehen.
Geht so etwas überhaupt?
Community rund um Cascading Style Sheets, Tutorials & KnowHow für Webmaster
Zwei Hintergrundbilder mit flexiblem Seitenrand
3 Beiträge • Seite 1 von 1
Zwei Hintergrundbilder mit flexiblem Seitenrand
von Mitternacht » 09.09.2011, 14:51
- Dateianhänge
-
- HP_Entwurf_Text_rechts.jpg (48.97 KiB) 288-mal betrachtet
- Mitternacht
- neu hier
- Beiträge: 4
- Registriert: 17.08.2011, 23:13
Re: Zwei Hintergrundbilder mit flexiblem Seitenrand
von Azra » 09.09.2011, 15:56
Vielleicht ...
Den <body> in der einen Farbe einfärben, die Bilder links und rechts einzeln abspeichern.
Dein Layout wird auf jeden Fall einen umschließenden Container haben da du es ja zentrierst. Diesen müsstest du dann mit position:relative; versehen. Die beiden Bilder positionierst du dann absolut links und rechts mit minus-Werten damit sie hinter dem Content hervorkommen. Da sie absolut Positioniert sind (aus dem Fluss der Seite hervorgeholt werden) erzeugen sie auch keinen Scrollbalken.
Eventuell musst du noch mit z-index arbeiten.
Den <body> in der einen Farbe einfärben, die Bilder links und rechts einzeln abspeichern.
Dein Layout wird auf jeden Fall einen umschließenden Container haben da du es ja zentrierst. Diesen müsstest du dann mit position:relative; versehen. Die beiden Bilder positionierst du dann absolut links und rechts mit minus-Werten damit sie hinter dem Content hervorkommen. Da sie absolut Positioniert sind (aus dem Fluss der Seite hervorgeholt werden) erzeugen sie auch keinen Scrollbalken.
Eventuell musst du noch mit z-index arbeiten.
“HTML is the language for describing the structure of Web pages.”
“CSS is the language for describing the presentation of Web pages, including colors, layout, and fonts.”
Noch weitere Probleme? Kontakt über meine Webseite - simonduda.ch
“CSS is the language for describing the presentation of Web pages, including colors, layout, and fonts.”
Noch weitere Probleme? Kontakt über meine Webseite - simonduda.ch
-
Azra - Stammuser
- Beiträge: 422
- Registriert: 04.02.2010, 08:36
- Wohnort: (Alten)bochum
Re: Zwei Hintergrundbilder mit flexiblem Seitenrand
von djheke » 14.09.2011, 20:08
Wenn ich es richtig verstanden habe, suchst du sowas.
http://www.gipspferd.de/forumhilfe/center/
http://www.gipspferd.de/forumhilfe/center/
-
djheke - Stammuser
- Beiträge: 233
- Registriert: 15.11.2010, 22:45
3 Beiträge • Seite 1 von 1
Moderatoren: Laus, Moderatoren
Ähnliche Beiträge zu "Zwei Hintergrundbilder mit flexiblem Seitenrand"
- Problem mit position:fixed und Frage nach zwei Hintergründen
- Lösung für zweiten content.
- IE7 zeigt an zwei Rechnern unterschiedliches
Zurück zu: CSS für Fortgeschrittene
Wer ist online?
Mitglieder in diesem Forum: 0 Mitglieder und 3 Gäste