Why an inline "background-image" style doesn't work in Chrome 10 and Internet Explorer 8?

Why the following example shows the image in Firefox 4, but not in Chrome 10 and Internet Explorer 8?

HTML:

<div></div>

CSS:

div { width: 60px; height: 60px; border: 1px solid black; }

Any ideas for workarounds?

4 Answers

As c-smile mentioned: Just need to remove the apostrophes in the url():

<div></div>

Demo here

u must specify the width and height also

 <section >

Chrome 11 spits out the following in its debugger:

[Error] GET undefined (undefined)

It looks like that hosting service is using some funky dynamic system that is preventing these browsers from fetching it correctly. (Instead it tries to fetch the default base image, which is problematically a jpeg.) Could you just upload another copy of the image elsewhere? I would expect it to be the easiest solution by a long mile.

Edit: See what happens in Chrome when you place the image using normal <img> tags ;)

it is working in my google chrome browser version 11.0.696.60

I created a simple page with no other items just basic tags and no separate CSS file and got an image

this is what i setup: