Hintergrund reflektierter - Verlauf
Vayu
- css
Hallo,
ich habe folgendes Problem und finde im Netz keine Antwort. Ich hoffe mir kann jemand hier helfen.
Ich möchte einen reflektierten Verlauf in den HG setzen, der nach außen dunkler wird.
Die Breite des Hintergrund Bildes beträgt 1407 px
Der Inhalt 864 px und wird zentriert im hellen Teil stattfinden.
Als Hintergrundfarbe wollte ich den dunkelsten Ton nehmen und den Verlauf in einen div packen und nach unten wiederholen lassen und auf 100% setzen.
Zudem soll wegen der enormen breite des HG auch bei einer geringeren Monitor Auflösung nicht gescrollt werden. Nur wenn der Inhaltsbereich die Auflösung überschreitet.
Geht das überhaupt den HG immer zentriert stattfinden zu lassen bei kleineren Auflösungen rechts und links verschwinden zu lassen.
Ich habe mal einen Screenshot gemacht und beigefügt, ich hoffe das was ich hier geschrieben habe ist verständlich.
Vielen Dank im voraus für eure Hilfe
Vayu
Hi,
Geht das überhaupt den HG immer zentriert stattfinden zu lassen bei kleineren Auflösungen rechts und links verschwinden zu lassen.
http://de.selfhtml.org/css/eigenschaften/hintergrund.htm#background_position
MfG ChrisB
Also leider klappt das noch nicht so ganz.
das horizontale scrollen bekomme ich nicht.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html><head><title>background-position</title>
<style type="text/css">
#verlauf {
background-image:url(hg_verlauf.jpg); background-repeat:repeat-y;
background-position:center;
position:absolute;
background-color:white; height:100%;
width:1406px;
padding-top:inherit;
padding-left:inherit;
padding-right:inherit;
margin-left:auto;
margin-right:auto;
}
body {
background-color: #3e3f3f;
}
</style>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"></head><body>
<div id="verlauf">
<h1>Test</h1>
</div>
</body></html>
Hi!
Spricht irgendwas dagegen, den Hintergrund in den body zu verfrachten? In deinem Beispiel jedenfalls scheint das egal zu sein.
Hattest Du nicht gesagt, das Div (der Inhalt) soll nur 864 Pixel breit sein?
Was funktioniert denn am horizontalem Scrollen nicht? Es sollte doch wunderbar scrollen, wenn der Viewport schmaler als Deine 1406 Pixel ist.
Es soll ja erst scrollen bei den 864 sprich der Inhalt. Der Hintergrund 1406px sollen nicht scrollen. und immer zentiert des bildschirms angezeigt werden. Ich bin nicht sicher ob das überhaupt funktioniert so wie ich mir das vorgestellt habe.
Moin!
Es soll ja erst scrollen bei den 864 sprich der Inhalt. Der Hintergrund 1406px sollen nicht scrollen. und immer zentiert des bildschirms angezeigt werden. Ich bin nicht sicher ob das überhaupt funktioniert so wie ich mir das vorgestellt habe.
:) Du hast meine kleinen Hinweise wohl nicht verstanden. Dein Vorhaben ist kein Problem, wenn Du dafuer sorgst, dass das Hintergrundbild in einem Element ist, das nicht scrollt. Warum hast Du es also in den Inhaltscontainer getan, der ja scrollen soll? Und warum ist es in einem Container der 1406 Pixel breit (obwohl Du moechtest, dass er soll nur 864 Pixel breit sein soll) ist, und entsprechend frueh scrollt?
Also: Hintergrundbild in den Body und da deinen 864 px Inhaltscontainer rein.