# Problem mit background-attachment: fixed



## tim-pong (2. Juni 2007)

Hallo Leute,

ich habe ein Layout mit verschiedenen <div>-Layern, einer davon ist auf overflow: auto gestellt, da der Inhalt oft länger ist, als die Höhe des Layers. Da sich beim scrollen aber der Hintergrund wiederholt, habe ich noch ein background-attachment: fixed in den Style des Layers eingefügt. Im IE (älter als Version 7) funktioniert es auch wunderbar. Nur Mozilla und IE (Version 7) können das irgendwie nicht anzeigen und nehmen das body-hintergrundbild und verschieben irgendwie auch die Breite des Layers.

Hier der CSS-Code:

```
#baby3-10 {
	position:absolute;
	left:349px;
	top:141px;
	width:675px;
	height:347px;
	background-image:url(images/baby3_10.gif);
	overflow: auto;
	padding-right: 20px;
	background-attachment: fixed;
}
```

Vielen Dank fürs anschauen,
Tim


----------



## Wissenscoder (2. Juni 2007)

kann man sich das Problem online anschauen?


----------



## Maik (2. Juni 2007)

Hi,

gibt es eventuell einen Link zur Seite, damit man sich das Problem mal im Ganzen betrachten kann?


----------



## tim-pong (2. Juni 2007)

Natürlich.
http://fetteshow.de


----------



## Maik (2. Juni 2007)

Bislang kann man nur den Inhalt der Seite und nicht des angesprochenen DIVs scrollen. Pack also dort mehr Inhalt rein, damit die overflow:auto-Eigenschaft überhaupt zum Tragen kommt.

Dass der Firefox das DIV breiter als der IE6 darstellt, liegt daran, dass du das Dokument ohne Doctype-Deklaration im Quirksmodus übergibst, und der IE6 das Boxmodell falsch interpretiert. Denn die Breite der Box setzt sich aus width:675px + padding-right:20px zusammen, und das ergibt eine Boxbreite von 695px, die der Firefox korrekt darstellt - siehe hierzu auch http://www.css4you.de/wsboxmodell/index.html#buh.


----------



## tim-pong (2. Juni 2007)

Hier nochmal die Box *mit* genug Inhalt:

http://fetteshow.de/rockd/music.php?site=bands


----------



## Maik (2. Juni 2007)

Ich weiss jetzt nicht, was bei dir falsch läuft, aber bei mir bleibt das Hintergrundbild beim Scrollen des Boxinhalts im Firefox stehen.


----------



## tim-pong (2. Juni 2007)

Ja, das stimmt schon.

Aber wenn man mal vergleicht, ist das dort angezeigte Hintergrundbild nicht das, was im CSS-Code difiniert ist. So sollte der Hintergrund aussehen (und tut es auch im IE vor Version 7):

http://fetteshow.de/rockd/images/baby3_10.gif


----------



## Maik (2. Juni 2007)

Versuch es mal hiermit:


```
#baby3-10 {
        position:absolute;
        left:349px;
        top:141px;
        width:675px;
        height:347px;
        background-image:url('images/baby3_10.gif');
        overflow: auto;
        padding-right: 20px;
}

* html #baby3-10 {
        background-attachment: fixed;
}
```
Da das Hintergrundbild 675px breit ist, solltest du die Breitenangabe für das DIV *baby3-10* auf 655px reduzieren, damit die Addition mit padding-right:20px 675px ergibt, sowie einen Dokumenttyp wählen, damit das Dokument nicht im Quirksmodus übergeben wird, und der IE6 das Boxmodell nicht falsch interpretiert.


----------



## tim-pong (2. Juni 2007)

Ok, Firefox findet das gut. Aber der IE 7 kommt immer noch nicht mit dem Hintergrundbild zurecht und dort ist jetzt auch der <div>-Layer nicht breit genug...


----------

