Background .png не отображается в Chrome и Firefox

Question

Я, должно быть, здесь упускаю что-то совершенно очевидное, но не могу найти в Интернете ничего, что могло бы сказать мне иначе.

Я пытаюсь вставить .png на страницу, используя:

background:url(img/runner1.png) no-repeat;

Я знаю, что путь правильный, потому что делать то же самое с jpg работает:

background:url(img/header.jpg) no-repeat;

Кажется, он работает в Safari, но не в Chrome или Firefox.

Являюсь ли яздесь чего-то не хватает?

---

РЕДАКТИРОВАТЬ - Я использую:

#runner1{
background:url(img/runner1.png) no-repeat;
float: left;
border: 1px solid #FFF;
width: 195px;
height: 205px;
}

для следующего элемента:

<div id="runner1"></div>

Страницапросто запускается локально с моего рабочего стола (поэтому сервер не задействован).

Как упоминалось ранее, пути не являются проблемой, потому что работает jpg из того же каталога.

Firebug говорит:

runner1.png 
GET
Success
image/png
index.html:201  
0B  
8ms

Но я не вижу предварительный просмотр или ответ в Firebug.

Также прямой доступ к файлу возвращает тот же результат.

Answer 1

Решено!

Может показаться, что при сохранении PNG в Photoshop создается PNG, который не совместим с Chrome или Firefox. Поэтому вместо этого я открыл файл с помощью Fireworks, заново сохранил файл и pngs работают.

Answer 2

У меня была такая же проблема с файлами .png, сохраненными из IrfanView: они не будут отображаться как фоновое изображение, пока я не выбрал опцию «Сохранить прозрачный цвет» в опциях сохранения PNG. Поэтому я думаю, что PNG должен быть сохранен без прозрачных цветов для отображения в качестве фоновых изображений.

Answer 3

Я думаю, что вы пропали без вести /. Попробуйте абсолютный путь URL.