Frage Hintergrundbild wird nicht angezeigt

[martinfre]

Hallo zusammen,

könnte mir bitte jmd erklären, weshalb das Bild test.jpg nicht zu sehen ist, obwohl die png-Bilder alle transparent sind?

Danke und liebe Grüße
Martin

<div style="width:100%; background-image:url(http://www.url.de/wp-content/uploads/test.jpg);">
<div style="width:25%; float:left;"><img src="http://www.url.de/wp-content/uploads/startseite-1-dunkel.png" class="img-zoom" /></div>
<div style="width:25%; float:left;"><img src="http://www.url.de/wp-content/uploads/startseite-2-dunkel.png" class="img-zoom" /></div>
<div style="width:25%; float:left;"><img src="http://www.url.de/wp-content/uploads/startseite-3-dunkel.png" class="img-zoom" /></div>
<div style="width:25%; float:left;"><img src="http://www.url.de/wp-content/uploads/startseite-4-dunkel.png" class="img-zoom" /></div>
</div>

 

[nookie]

Mit dem Snippet kann man nicht wirklich etwas anfangen, bzw. dir auch nicht weiterhelfen. Da muss schon ein bisschen mehr von deine Seite aus kommen.

 

[martinfre]

Hallo nookie,

danke für die schnelle Antwort.

Es handelt sich um eine Wordpress-Seite. Mehr ist auf der Seite nicht drauf. Es geht auch grundsätzlich mehr um das allgemeine Verständnis, weshalb das Hintergrundbild nicht zu sehen ist. Entferne ich die vier inneren DIVs, sieht man das Bild. Mit den DIVs jedoch nicht, obwohl die jeweiligen Hintergrundbilder transparent sind.

Danke und liebe Grüße
Martin

 

[MrMurphy]

Hallo

Dann sind die inneren Bilder nicht transparent, obwohl du es vermutest.

Das kann auch an CSS-Angaben liegen.

Ohne Zugriff auf die Bilder und das CSS können wir weiteres aber nur raten.

Gruss

MrMurphy

 

[SpiceLab]

Es geht auch grundsätzlich mehr um das allgemeine Verständnis, weshalb das Hintergrundbild nicht zu sehen ist. Entferne ich die vier inneren DIVs, sieht man das Bild. Mit den DIVs jedoch nicht,

Wegen float:left für die inneren Blöcke, fehlt beispielsweise außen herum overflow:hidden.

<div style="... overflow:hidden">

http://www.sitepoint.com/clearing-floats-overview-different-clearfix-methods/

 

[scbawik]

Wegen float:left für die inneren Blöcke, fehlt beispielsweise außen herum overflow:hidden.

<div style="... overflow:hidden">

http://www.sitepoint.com/clearing-floats-overview-different-clearfix-methods/

overflow:hidden funktioniert zwar auch um zu clearen, ein "self clear" ist jedoch flexibler:
https://css-tricks.com/snippets/css/clear-fix/

 

[SpiceLab]

overflow:hidden funktioniert zwar auch um zu clearen, ein "self clear" ist jedoch flexibler:
https://css-tricks.com/snippets/css/clear-fix/

Siehe "Method 3: The “clearfix” Class" im genannten Artikel

Darum auch meine bewusst gewählte Formulierung "fehlt beispielsweise..." ;)