Oliver Dzierzon: Backgroundimage skaliert im DIV

Beitrag lesen

Hallo zusammen,

habe Im archiv keine Antwort auf meine Frage gefunden. Mein Problem:
Ich habe einen <div></div> Bereich mit Hintergrundbild. Der darin enthaltene Fließtext  passt normalerweise direkt über das Image. Ich will nun aber, dass bei Browsern mit grösserer Font-size Einstellung der Text nicht über den <div></div> Bereich hinausläuft.

Also habe ich folgende Style Anweisung :

style="width:677px; height:375px; border: solid 1px #ffffff; background-image:url(images/content.gif);background-attachment:fixed;overflow:auto; "

Im  IE6.0 klappt das auch einwandfrei. der Mozilla1.4 macht mir hier jedoch Schwierigkeiten, und zwar immer dann, wenn ich zusätzlich  mit "background-attachment:fixed" das Hintergrundbild fixieren möchte. In diesem Fall wird das Hintergrundbild negativ skaliert (auf ca 1/4 der ursprünglichen Grösse), so dass der grösste Teil des <div></div> Bereichs dann ohne Hintergrundbild bleibt. Eigentlich hat das Hintergrundbild genau die Grösse des <div></div> Bereichs.

Kann mir bitte jemand sagen, wo hier mein Fehler liegt? Hier jetzt noch mein Quelltext.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Test</title>
<style>
.content {
text-align:justify;
color: #eeeeee;
font-size: 10pt;
margin-left: 40px;
margin-top: 40px;
margin-right:40px;
margin-bottom:40px;
}
</style>
</head>
<body>
<div style="position:absolute; top:0px; left:0px; height:100%">
<table border="0" height="100%" width="100%" align="center">
<tr>
<td align="center" valign="middle" height="100%">
<div style="width:677px; height:375px; text-align:left; border: solid 1px #ffffff; background-image:url(images/content.gif);background-attachment:fixed;overflow:auto;">
<div class="content" style="border: solid 1px #ffffff;">
test test test test test test test test test test test
test test test test test test test test test test test
test test test test test test test test test test test
test test test test test test test test test test test
test test test test test test test test test test test
test test test test test test test test test test test
test test test test test test test test test test test
test test test test test test test test test test test
test test test test test test test test test test test
test test test test test test test test test test test
</div>
</div>
</td>
</tr>
</table>
</div>
</body>
</html>

Viele Grüsse

Olli