Background-Image will nicht

[Marco Brummund]

Hallo an alle Helfer und HelfersHelfer ;)

ich bin / war heute mal wieder ein wenig am Rumbasteln und da kam mir ein sehr seltsames Problem unter.

Mit folgendem Quelltext bzw. CSS Code wird die Hintergrundgrafik angezeigt:

  
#texte  
			{  
			 margin-left      : 0px;  
			 margin-right     : 20px;  
                         padding-top      : 10px;  
                         padding-bottom   : 10px;  
			 width            : 320px;  
			 background-image : url('../bilder/diam.png');  
			 background-repeat: no-repeat;  
			 background-position: bottom right;  
			 text-align       : justify;  
			 float            : left;  
			}  

Sobald ich aber die Position auf feste Pixel bringen mag und selbige fixiere wird die Grafik nicht mehr angezeigt:

  
#texte  
			{  
			 margin-left      : 0px;  
			 margin-right     : 20px;  
                         padding-top      : 10px;  
                         padding-bottom   : 10px;  
			 width            : 320px;  
			 background-image : url('../bilder/diam.png');  
			 background-repeat: no-repeat;  
			 background-attachment: fixed;  
			 background-position: 170px 280px;  
			 text-align       : justify;  
			 float            : left;  
			}  

Die aufzurufende Grafik hat Abmessungen von 130 x 183 px.
Der Texte-Div ist 320px breit, der umschließende "Inhalt"-Div 480px hoch und nur nach unten scrollbar.

Neben dem "Texte"-Div wird noch ein Bilder-Div aufgerufen, deshalb das float.

Beißen sich etwa float und background-position oder wo liegt mein Fehler? Ich zweifel schon an mir selber ... :(

Getestet bis jetzt auf FF3 und IE7.

vielen Dank im voraus.

[Wlad]

Hallo,

versuch doch mal für #texte eine Höhe zu setzen.

gruß,
Wlad

[Marco Brummund]

versuch doch mal für #texte eine Höhe zu setzen.

Das schafft leider keine Abhilfe, selbst wenn ich für die Höhe 1000px deklariere.

[Wlad]

Hi,

also bei mir funktioniert das im FF 3 und IE 7 einwandfrei.
Der Fehler muss an einer anderen Stelle liegen.

Gruß,
Hagen

[Maxx]

Hi Marco,

background-image : url('../bilder/diam.png');
background-repeat: no-repeat;
background-attachment: fixed;
background-position: 170px 280px;

durch die Kombination mit "fixed" bezieht sich die Angabe 170, 280 auf den Viewport, *nicht* relativ zu #texte

Möglicherweise hilft dir: http://forum.de.selfhtml.org/archiv/2007/8/t157334/#m1023594 und folgende.

Und benutze bitte eine Emailadresse die dir auch gehört.

Grüße,

Jochen

[Marco Brummund]

durch die Kombination mit "fixed" bezieht sich die Angabe 170, 280 auf den Viewport, *nicht* relativ zu #texte

Ja, an diesen Viewpoint bin ich schon über Selfhtml geraten, nur konnte ich damit nicht sofort was anfangen. In dem Posting von dir steht es dann aber ja. Nur eben - wenn es die linke obere Ecke des Browser ist - ergibt sich ja von Auflösung zu Auflösung ein anderes Ergebnis ... mist.

Wie könnte ich das jetzt dennoch fixiert bekommen. Wäre ein Div, welches per z-index hinter "texte" gelegt wird sinnvoll? Würde mir jetzt spontan als erstes einfallen :D

Und benutze bitte eine E-Mail-Aadresse die dir auch gehört.

Ja, ich dachte leider man *muss* eine angeben und von daher verwende ich gerne Phantasie-Mails ... sorry :(

Gruß Marco.

[Gunnar Bittersmann]

@@Marco Brummund:

»» Und benutze bitte eine E-Mail-Aadresse die dir auch gehört.

Ja, ich dachte leider man *muss* eine angeben

?? Da steht doch: „Deine E-Mail (optional):“

Wenn du das Wort „optional“ nicht verstehst, schlag es in einem Wörterbuch deiner Wahl nach. Bspw. im Wiktionary.

Live long and prosper,
Gunnar

[Maxx]

Hallo Marco,

Wie könnte ich das jetzt dennoch fixiert bekommen. Wäre ein Div, welches per z-index hinter "texte" gelegt wird sinnvoll?

welchen Effekt möchtest du denn erreichen? Was soll wie fixiert werden?
Mach mal ein Bild, dann findet sich bestimmt eine Lösung.

Grüße,

Jochen

[Marco Brummund]

welchen Effekt möchtest du denn erreichen? Was soll wie fixiert werden?
Mach mal ein Bild, dann findet sich bestimmt eine Lösung.

Hallo Jochen, vielen Dank für deine Mühen und Geduld ;)

Ein Bild muss ich nicht machen, die Seite wäre: http://www.exclusivehorses.de/

Der Diamant, der nun hinter dem Text ist, soll fixiert am unteren Rand, rechts beim Text stehen. Also nicht mitscrollen, wenn der Text mal länger ist (z.B. bei Veranstaltungen).

Momentan ist er eben per CSS mit bottom und right im "Texte"-DIV eingebunden.

Danke im Voraus.

Gruß Marco.

[Maxx]

Hallo Marco,

Ein Bild muss ich nicht machen, die Seite wäre: http://www.exclusivehorses.de/

ich habe mir das nur kurz angesehen, was mir aufgefallen ist:
Die Darstellung in Opera und FF unterscheidet sich. Das liegt vermutlich am
overflow-x, overflow-y die Opera nicht kennt.

Eigentlich müsste die Verbindung von overflow:scroll und einem positionierten Hintergrund -auch ohne das "fixed"- zu einem nicht mitscrollenden Hintergrundbild führen. Zumindest in einem standardkonformen Browser.
Probier doch mal folgendes aus.

  
  background-image : url('../bilder/diam.png');  
  background-repeat: no-repeat;  
  background-position: bottom right;

von #texte in das #inhalt <div> zu verschieben. Möglicherweise musst du die Grafik etwas anpassen um die passende Position zu erhalten.

HTH

Jochen