✔ Bild über background: url(..) wird im Div nicht angezeigt

A

apfelschorle

Grünschnabel
Hallo,

ich hab das Problem, das einige farbigen Blöcke die ich durch png-Bilddateien ersetzen will, nicht dargestellt werden.

Der HTML und CSS Code:
https://jsfiddle.net/#&togetherjs=CJFLtKmUvb

Beispielsweise wird der gelbe Kasten mit der Beschriftung "Preise" durch das png-Bild nicht dargestellt.

Die Bilder werden mit dem folgenden Befehl eingebunden.
background: url("pfoetchen.png");

Was könnte dabei das Problem sein? Die Größe des Div's wurde im #Menuepunkt1 definiert.
 
apfelschorle hat gesagt.:
Beispielsweise wird der gelbe Kasten mit der Beschriftung "Preise" durch das png-Bild nicht dargestellt.
Zum Vergrößern anklicken....
Durch welches PNG?
apfelschorle hat gesagt.:
Die Bilder werden mit dem folgenden Befehl eingebunden.
background: url("pfoetchen.png");
Zum Vergrößern anklicken....
Davon sehe ich nichts im CSS.

Überhaupt ist nirgends ein Hintergrundbild definiert, und für #header blos auskommentiert.

Übrigens fehlt hier am Ende das schliessende >:
HTML: 
<link rel="stylesheet" type="text/css" href="style.css"
Und im jsfiddle-HTML-Panel wird lediglich der Code zwischen <body></body> eingesetzt. Man beachte die dortigen Hinweise.
 
Das ist mir klar. Ich habe den HTML und CSS Code mit phase5 erstellt. Die Bilder befinden sich im gleichen Ordner wie die index.html und die stylesheet Datei. Komischerweise werden aber nicht alle Bilder in den div's dargestellt. Deswegen ja meine Frage hier im Forum. Beispielsweise wird das Bild aus #Menuepunkt1 nicht dargestellt. Aber das Logo in #logo schon.
 
Um mal hierbei zu bleiben:
CSS: 
#rechterRand {
 background: url("pfoetchen.png") repeat-x;
 float: left;
 height: 169px;  
}
Das Hintergrundbild erscheint nicht, weil dieses Element im HTML-Code keinen Inhalt besitzt, und wegen float:left somit 0px breit ist.
 
apfelschorle hat gesagt.:
Beispielsweise wird das Bild aus #Menuepunkt1 nicht dargestellt.
Zum Vergrößern anklicken....
Mit auskommentierter background-attachment:fixed-Regel wird es bei mir "sauber" angezeigt. Ansonsten erscheint es nur zeitweise, wenn die Seite gescrollt wird.
CSS: 
#Menuepunkt1 {
background: url("menuepunkt.png") no-repeat;/*yellow;  */
/*background-attachment: fixed;*/
width: 267px;
height: 97px;
clear: both;
}
https://jsfiddle.net/spicelab/sy8ud1rb/
 
Ok hab eine definierte Breite vorgegeben, da die Breite der Website eh fest ist.

Was ist aber mit den anderen Bildern z.B. #Menuepunkt1? Breite und Höhe sind angegeben, das Bild wird aber leider nicht dargestellt.

Edit: In Firefox und mit der Vorschaufunktion von phase5 wird es bei mir trotz auskommentiertem background-attachment: fixed; nicht angezeigt
 
Hab es auskommentiert und bei mir wirds immer noch nicht dargestellt. Welchen Browser verwendest du?

Was kann man tun wenn man z.B. keine Breite bzw. Höhe angegeben hat und das Bild trotzdem dargestellt werden soll? Z.B. wenn die Breite oder Höhe dynamsich mit dem Inhalt verändert?
 
Um antworten zu können musst du eingeloggt sein.

Neue Beiträge

Zurück