IE 8 специфическая ошибка фонового изображения

Question

У меня 1 пиксель на 1 пиксель серого цвета.Он используется как BG-изображение:

background-attachment:scroll;
background-color:transparent;
background-image:url("../image/vertical-border.png");
background-position:393px 0;
background-repeat:repeat-y;

Так что я ожидаю, что серая вертикальная линия высотой того, что является самым высоким в div.Общая хитрость.

Так что я вижу это правильно в каждом браузере, КРОМЕ IE 8. В IE 8 это отображается как градиент.Темно вверху, светло внизу.Насколько это безумие?Я никогда не видел ничего подобного, и мне бы хотелось немного постичь.

Спасибо!

Answer 1

К сожалению, это ошибка рендеринга PNG (неожиданный сюрприз), в большинстве случаев люди увеличивают размер мозаичного изображения PNG до 10x10, и проблема устраняется.Надеюсь, что это нормально для вас - возможно, используйте 1x10, или, что еще лучше, 1x50 ...

Частичным объяснением по памяти был объем обработки, требуемый IE для применения его фильтрации к изображениям 1x1, когдаВы умножаете его на количество раз, когда оно появляется на экране - это просто слишком хардкор для IE.

См .: Рендеринг прозрачных png-файлов IE8 на моем сайте и связанные с ним сообщениякомментарии.

РЕДАКТИРОВАТЬ: Эй, так как это просто вертикальная линия, можно ли вместо этого просто использовать формат GIF?Или, может быть, 8-битный, не альфа-прозрачный PNG?

Answer 2

Если вам нужна серая граница 1px, почему бы просто не использовать серую рамку 1px?

Пример:

border-right: 1px solid #cccccc;