ie6 css фоновое изображение проблемы

Question

У меня есть стиль CSS, который отображает изображение в фоновом режиме. Хорошо работает во всех браузерах, кроме ie6.

В ie6 фоновое изображение растягивается, чтобы соответствовать блоку. Как мне это решить? Вот CSS, который я использую для этого.

.error
{
    color: #D8000C;
    background-color: #FFBABA;
    background-image: url('error.png');
}

IE7 / FF3.5

IE6

Answer 1

Вы, вероятно, используете сценарий исправления прозрачности png для IE6, я думаю, что проблема заключается там, потому что он, вероятно, применяет метод масштабирования.

Прочитать комментарии на этой странице .

Документация вашего исправления прозрачности png, вероятно, покроет это.

Лично я обнаружил, что использование прозрачных pngs в IE 6.0 является основной проблемой в заднице, несмотря на все возможные исправления. Я знаю, что это не оригинальный ответ, но я бы, вероятно, просто сделал условную проверку и заменил бы изображение на версию gif или jpg, если вам действительно нужна поддержка IE 6.0, вместо того, чтобы полагаться на хаки для поддержки этого. Или просто отмените IE 6.0, в этом году я уговорил каждого клиента не поддерживать IE 6.0 в своих новых проектах. Серьезно, чертовски давно пора перестать делать нашу профессиональную жизнь такой чертовски несчастной.

Answer 2

Если вы используете фильтр AlphaImageLoader , убедитесь, что sizingMethod='scale' отсутствует. Удалите его или установите image вместо scale.

Answer 3

Belatedpng - лучший скрипт, который я нашел для этой проблемы: http://www.dillerdesign.com/experiment/DD_belatedPNG/

Answer 4

установить фактическую ширину и высоту для фонового изображения и background-position.

    .error
{
    color: #D8000C;
    background-color: #FFBABA;
    background-image: url('error.png');
    background-position:left;
    width:251px; 
    height:72px; 
    background-repeat:no-repeat;
}

здесь ширина и высота являются фактическим размером изображения error.png. надеюсь, это поможет.