为什么 `display: inline-block` 在 IE6 和 IE7 中出现故障，如何修复？

Internet Explorer 6 和 7 中的内联块兼容性问题

尽管 CSS 属性“display: inline-block”被广泛使用，但它仍然存在旧版本的 Internet Explorer 中存在已知的兼容性问题。具体来说，它在 IE6 和 IE7 中无法按预期工作。

IE6/IE7 与 Inline-Block 的怪癖

在 IE6 和 IE7 中，“display: inline-block “仅在自然内联的元素（例如跨度）上正常运行。将其应用于 div 等块级元素会导致意外行为。

IE6/IE7 的解决方法

要解决 IE6 和 IE7 中的这些问题，具体的解决方法是必要的：

#yourElement {
    display: inline-block;
    *display: inline;
    zoom: 1;
}

“*display: inline”伪类使用仅针对目标的CSS hack IE7 及更早版本。 “zoom: 1”属性强制 IE6 和 IE7 将元素识别为具有“布局”，这是“display: inline-block”正常运行所必需的。

附加说明

虽然技术上可行，但不建议尝试在使用供应商前缀属性的同时保持此解决方法有效的 CSS。要全面了解“display: inline-block”及其兼容性问题，请参阅提供的答案中的链接资源。

以上是为什么 `display: inline-block` 在 IE6 和 IE7 中出现故障，如何修复？的详细内容。更多信息请关注PHP中文网其他相关文章！