Internet Explorer 8 показывает градиент вместо фонового изображения

У меня странная ошибка. Я разбиваю полупрозрачный 1x1 пиксель желтый PNG изображение в DIV, которое накладывает некоторый текст. В обычных браузерах все выглядит так, как должно. Там есть текст и желтый, полупрозрачный надпись над ним.

Однако в Internet Explorer 8 вместо тайлирования изображения 1x1 PNG отображается градиент (!).

CSS довольно прост:

.edit_section_overlay {
  position: absolute;
  z-index: 150;

  top: -6px;
  bottom: -6px;
  left: -6px;
  right: -6px;

  border: 1px solid #afad9d;
  background: url('../../images/content/edit/section/overlay/background-color.png') repeat;

  min-height: 34px;
  cursor: move;
}

Я никогда не видел ошибку, как это раньше, и Google не помогает мне...

Вот демо в jsFiddle, http://jsfiddle.net/jUVfS/

Ответ 1