Question

我申请 stackoverflow 作为我的最后手段。我在链接的背景使用图像时得到了这个ie6错误。似乎ie6滚动背景。我怎么能避免它？

在某个宽度，它显示如下：
alt text http://img135.imageshack.us/img135/8849/badie1.png

在其他一些地方，它表明： alt text http://img522.imageshack.us/img522/8180/badie2.png

IE7＆amp; FF就像我期望的那样表现出来：
alt text 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;
     }

任何提示如何避免这种情况？

Answer 1

我自己遇到了这个问题，我发现在带有背景图像的元素上使用overflow:hidden解决了很多我的IE6问题（虽然不是全部）。

Answer 2

我会找到一个适用于IE6的解决方案，并使用Conditional Comments过滤掉IE7，FF等的其他正确版本。我也会避免在background-position中使用IE6中的百分比（{ {3}}）。

Answer 3

根据this answer至a somewhat related question的建议，我建议使用background-position-x和background-position-y代替background-position进行IE（IE8之前）。< / p>

Answer 4

你不能在任何* ie6 .png修复中使用background-position解决方案是使图像成为gif或8位png。

*我没有/尝试

Answer 5

如果元素中包含padding-top或padding-bottom背景图片和background-positioning - 在IE6中，您可以将padding-top: 16px;更改为margin-top: 16px;解决了这个问题。

它不会推动其他元素，并且不再填充填充。
否则，在IE7和IE8中，填充属性有效。

Answer 6

更改

background-position:0% 50%;

到

background-position:50% 50%;

并添加

background-repeat: no-repeat;

这将使图像在水平和垂直方向上居中，并使图像停止平铺。

IE6后台位置（？）问题

6 个答案: