Question

我正在使用CSS3PIE将一些圆角应用于Internet Explorer中的元素，这些元素将通过其他浏览器中的样式表获取。我遇到了一些问题。

在IE8中，我发现任何具有PIE行为的元素都会表现得很奇怪。容器将向右跳几个像素，但内容将保持在其原始位置，从而给出内容相对于其容器向左移动的外观。对于没有或少量填充的元素，这将特别成问题。

我能够通过使用X-UA-Compatible来解决IE8中的问题，但是如果可能的话，我宁愿避免这种解决方案。我无法访问IE9进行测试，但是像PIE这样的理解并不是必需的，在不需要它的浏览器中强制使用兼容模式会很浪费。

我在IE6中遇到了更糟糕的问题，PIE布局在设置为使用display:inline; zoom:1;列表项的列表上完全分解（模拟内联块，在IE8和其他浏览器中工作）。这里列表项的边框完全呈现在错误的位置。

理想情况下，我希望PIE在IE6和IE8中正常工作，而不必采用兼容模式。就IE6而言，没有应用PIE的优雅后备就可以了。 IE7是唯一一个页面按预期显示的浏览器。

我暂时无法提供示例页面，但我稍后可以添加一个。

跟进：

以下是使用IE Tester进行的一些屏幕抓取。我希望他们能让每个人都清楚一点。如你所见，IE7很好。但是，在IE8中，容器相对于其内容向左偏移，而在IE6中，列表元素（带有圆形的1像素边框）完全混乱！

Internet Explorer 8 with offset boxes IE7 is correct IE6 is really mangled!

IE8，IE7和IE6的完整尺寸版本也可用

跟进2

这是演示页面的链接。

当其他设计师正在研究样式表和设计的其他部分时，我不能保证它会长时间保持完全反射，但希望它能够长时间解决问题。（是的，我知道IE6中存在JS错误，这些不是我的问题） Example page

Answer 1

Answer 2

我遇到了与IE8类似的问题。应用的元素PIE首先显示低10-20px，然后跳到正确的位置。将规则“display：inline”应用于元素似乎可以解决问题。 “位置：相对;”并且元素或父元素上的“zoom：1”似乎没有效果。

这有点奇怪。应用规则“display：inline”后，问题就会消失刷新。但是如果你删除了规则，它在刷新时仍然看起来没问题，直到你关闭并重新打开浏览器窗口 - 然后重新出现跳跃。

希望能有所帮助。

Answer 3

尝试添加

position:relative;
z-index: 0;

所建议的那样