为什么 Inline-Block 在 IE8 中不能正常工作？-css教程-PHP中文网

为什么 Inline-Block 在 IE8 中不能正常工作？

Susan Sarandon

发布： 2024-10-29 05:59:02

原创

529 人浏览过

Why Doesn't Inline-Block Work Properly in IE8?

IE8 显示：内联块错误已解决

在 IE8 中，尽管它明显支持内联块，但一些用户遇到了内联问题展示。要解决此问题，请确保在 HTML 标记之前声明 doctype。

以下代码演示了 IE8 中 inline-block 的用法：

<code class="css">span, ul, ul li {
  display: inline-block;
  vertical-align: top;
  margin: 0;
  padding: 0;
  list-style: none;
}</code>

登录后复制

<code class="html"><span>I would want</span>
<ul>
  <li>this</li>
  <li>on</li>
  <li>one line.</li>
</ul></code>

登录后复制

此代码旨在内联对齐 span 和列表元素，如 Google Chrome 等浏览器中所示。但是，由于缺少文档类型，IE8 用户可能会遇到不正确的对齐情况。为了确保在 IE8 中正确显示，请添加以下声明作为代码的第一行：

<code class="html"><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"></code>

登录后复制

此文档类型通知 IE8 该文档遵循 HTML5 标准，解决了显示问题并正确对齐元素正如预期的那样。

以上是为什么 Inline-Block 在 IE8 中不能正常工作？的详细内容。更多信息请关注PHP中文网其他相关文章！