[CSS] Hintergrund unten will nicht

**Benny-one** · 09.11.2007, 23:41

html, body {
height: 100%;
}

**strauberry** · 10.11.2007, 09:45

Danke für die Antwort!

Funktioniert aber leider nur halb :-) Wenn es keine Scrollbars gibt, ist der Hintergrund am unteren Ende der Seite, das passt. Muss man aber scrollen, liegt der Hintergrund genau in der Mitte. Durch diese Angabe bezieht sich das bottom wohl auf den Viewport und nicht auf die Seite.

**pekka** · 10.11.2007, 10:44

Da gab es einen Trick... War das min-height?

**asp2php** · 10.11.2007, 10:49

oder mach ihn am Bildschirmrand fest (position:fixed), dann ist es egal wie lang die Seite ist.

**strauberry** · 10.11.2007, 10:58

min-height raffen nicht alle Browser und wenn ich position:fixed mache, bleibt der beim scrollen stehen :-) ein position: absolute; bottom: 0px; richtet das Teil am Viewport aus.... ist das ne K***

**ghostgambler** · 10.11.2007, 12:41

Dann machst du halt mehrere Angaben, allá

Code:

html, body {
  min-height:100%;
}
* html, * html body {
  height:100%;
}

**strauberry** · 12.11.2007, 08:34

Mit den verschiedenen Angaben würde zwar das Browser-Problem behoben, aber leider nicht, dass sich das 100% auf das Viewport bezieht.

**ThaDafinser** · 12.11.2007, 11:54

absolutes div?

**Wyveres** · 12.11.2007, 17:13

wie währe es mal mit der richtigen angabe für den BG x)

z.b. background-attachment:fixed;

www.css4you.de

**Benny-one** · 12.11.2007, 17:21

Weil dadurch das BG so groß wie der Viewport sein müsste. Aber da man vermutlich nur ein 1px hohes und vll 800px breites bild vom Browser vertikal wiederholen lassen möchte, braucht man eben background-repeat und kein fixed. Und das ganze Problem lässt sich mit height: 100% und min-height: 100% lösen. Es muss allerdings eine Browserweiche verwendet werden, weil der IE allergisch auf min-height und der FF allergisch auf das height reagiert, wenn min-height gesetzt wurde. So wars glaube ich. Und wenn nicht, es gibt zig Seiten (sogar viele meiner Seiten) nutzen das.

**Wyveres** · 13.11.2007, 09:40

Original geschrieben von Benny-one
Weil dadurch das BG so groß wie der Viewport sein müsste. Aber da man vermutlich nur ein 1px hohes und vll 800px breites bild vom Browser vertikal wiederholen lassen möchte, braucht man eben background-repeat und kein fixed. Und das ganze Problem lässt sich mit height: 100% und min-height: 100% lösen. Es muss allerdings eine Browserweiche verwendet werden, weil der IE allergisch auf min-height und der FF allergisch auf das height reagiert, wenn min-height gesetzt wurde. So wars glaube ich. Und wenn nicht, es gibt zig Seiten (sogar viele meiner Seiten) nutzen das.

Oo? hä was hat Background-repeat: repeat-y; mit Background-attachment:fixed; zutun?

http://ddc-forever.de/bg_div.html

beweist das beides geht!

und es geht im Opera, IE und FF

Und nichts mit min-height height für body ...

und selbst wenn ich background-repeat auf no-repeat stelle bleibt das verhalten gleich.

**Benny-one** · 13.11.2007, 09:49

okay, das ergebnis hatte ich so nicht erwartet. macht die sache ja einfacher.

Allerdings geht das auch nicht immer, denn ab und zu (z.B. in meinem Fall) ist der BG für den Body bereits gesetzt und ein anderer BG muss einem DIV zugeteilt werden. Dann geht das nicht mehr.

**Wyveres** · 13.11.2007, 10:06

Original geschrieben von Benny-one
okay, das ergebnis hatte ich so nicht erwartet. macht die sache ja einfacher.

Allerdings geht das auch nicht immer, denn ab und zu (z.B. in meinem Fall) ist der BG für den Body bereits gesetzt und ein anderer BG muss einem DIV zugeteilt werden. Dann geht das nicht mehr.

ich will dir ja nicht wiedersprechen denn auch das ist Vollkommen FALSCH x)

ich hab die URL oben mal um zwei DIVs erweitert x) und dem ebenfalls folgendes zugewiesen.

Code:

// mit fixed
.background
{
background-color:yellow;
background-image:url("image/ddc_small.png");
background-attachment: fixed;
background-position: right;
background-repeat:repeat-y;
height:300px;
width:100%;
border:1px solid black;
}
// ohne fixed
.background_2
{
background-color:yellow;
background-image:url("image/ddc_small.png");
background-position: right;
background-repeat:repeat-y;
height:300px;
width:100%;
border:1px solid black;
}

EDIT:

das sagt css4you dazu x)

Bemerkung: Der Internet Explorer bis zur Version 6 kennt background-attachment nur im <body>-Tag. Opera 6, Mozilla 1 und Netscape 7 akzeptieren es auch in anderen Elementen wie Absätzen (<p>) und <div>-Containern. Der Opera 6 fixiert Hintergrundbilder sogar in Tabellenzellen.

wir könnten uns jetzt streiten was gemeint ist aber grundsätzlich ... kann man Hintergrundbilder auf jedes element papen ... und sie positionieren nur halt nicht fixieren ... wenn mans geschickt anstellt. kann man dadurch schöne effekte erziehlen *g*

**Benny-one** · 13.11.2007, 10:14

Ich weiß nicht ob das Ergebnis so von der gewünscht ist. Falls ja ist es nicht das, was ich meinte.

Guck mal hier http://www.dsl-flieden.de/ es geht mir um den Schatten der von oben bis unten gesetzt wird. Der FF bekommt ein min-height, der IE ein height 100% da es sonst beim Scrollen zu Fehlern kommt.

Bastel das mit deiner Variante nach, dann glaube ich dir

[CSS] Hintergrund unten will nicht