为什么 Inline-Block 在 Internet Explorer 6 和 7 中不起作用，如何修复它？

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

CSS 中 inline-block 的概念允许元素同时表现为内联和块级元素同时进行。但是，如果您遇到 inline-block 在 Internet Explorer 6 和 7 中无法工作的问题，那么您并不孤单。

问题：

默认情况下, inline-block 仅适用于固有的内联元素，例如 span。将其应用于 IE6 和 IE7 中的 div 等其他元素可能会导致不可预测的行为。

解决方案：

要解决此问题并在非上启用内联块IE6/7 中的内联元素，您需要采用解决方法。这涉及添加以下 CSS：

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

以下是解决方法的细分：

• *display: inline 是针对 IE7 及更低版本的“安全”CSS 黑客。它会覆盖 inline-block 设置的显示属性。
• zoom: 1 强制 IE6/7 将“布局”应用于元素。布局对于 inline-block 的一致工作至关重要。

其他注意事项：

可以在保持有效 CSS 的同时实现此解决方法，但通常不是这样推荐，特别是如果您已经在使用其他供应商特定的前缀。

有关显示的更多见解： inline-block，参考外部资源，但注意 -moz-inline-stack 不再需要，因为它仅适用于 Firefox 2。

以上是为什么 Inline-Block 在 Internet Explorer 6 和 7 中不起作用，如何修复它？的详细内容。更多信息请关注PHP中文网其他相关文章！