IE6 background-position (?) Проблема - PullRequest
Новая
       17

IE6 background-position (?) Проблема

5 голосов
/ 18 апреля 2009

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

На некоторой ширине это выглядит так:
альтернативный текст http://img135.imageshack.us/img135/8849/badie1.png

А на каком-то другом это выглядит так:
альтернативный текст http://img522.imageshack.us/img522/8180/badie2.png

IE7 и FF показывают это так, как я ожидал:
альтернативный текст http://img142.imageshack.us/img142/2296/goodie.png
Ссылки размещены внутри div, который плавает вправо. 

<a href="/tr" class="menuLink" style="background-image:url(/img/tr.png);">TR</a>
<a href="/eng" class="menuLink" style="background-image:url(/img/eng.png); margin-right:30px;">ENG</a>
<a href="/logout" class="menuLink" style="background-image:url(/img/logout.png);"><?=$ui["exit"];?></a>

   .menuLink {
     font-family:"Tahoma";
     font-size:11px;
     color:#003300;
     text-decoration:underline;
     font-weight: bold;
     background-position:0% 50%;
     background-repeat:no-repeat;
    }
     .menuLink:hover {
     font-size:11px;
     color:#047307;
     text-decoration:underline;
     font-weight: bold;
     }

Любые намеки, как этого избежать?

Ответы [ 6 ]

3 голосов
/ 04 мая 2009

Я сам столкнулся с этой проблемой и обнаружил, что использование overflow:hidden для элемента с фоновым изображением решило многие мои проблемы с IE6 (хотя и не все).

1 голос
/ 17 октября 2010

Если у вас есть padding-top или padding-bottom в вашем элементе с фоновыми изображениями и background-positioning - в IE6 вы можете изменить padding-top: 16px; на margin-top: 16px;, и это решит проблему.

Он не отталкивает другие элементы и больше удваивает отступ.
В противном случае в IE7 и IE8 атрибут padding работает.

1 голос
/ 14 апреля 2010

Вы не можете использовать background-position с любыми * ie6 .png исправлениями, решение состоит в том, чтобы сделать изображение gif или 8-битным png.

* Ни один, который я использую / пробовал

1 голос
/ 14 мая 2009

Как рекомендовано в этом ответе на несколько связанный вопрос , я бы рекомендовал использовать background-position-x и background-position-y вместо background-position для IE (до IE8) .

1 голос
/ 18 апреля 2009

Я бы нашел решение, которое работает для IE6, и использовал бы Условные комментарии , чтобы отфильтровать другие правильные версии для IE7, FF и т. Д. Я бы также избегал использования процентов в background-position для IE6 ( ссылка ).

0 голосов
/ 21 апреля 2009

Изменение 

background-position:0% 50%;

до 

background-position:50% 50%;

и добавьте 

background-repeat: no-repeat;

Это позволит центрировать изображение как по горизонтали, так и по вертикали и остановить мозаичное изображение.

...