边距：自动在 IE 中不起作用答案

【问题标题】：Margin: Auto not working in IE边距：自动在 IE 中不起作用
【发布时间】：2011-12-10 06:04:30
【问题描述】：

URL:http://cyberbat.co.uk/testcontainer margin:auto 不工作，有没有其他方法可以放在IE中间。

编辑：再次检查， index.php 是错误的文件，我用 index.html 替换它。

【问题讨论】：

糟糕的问题。显示一些 HTML 源代码，我们不想从您的链接中找到它......然后把什么放在中间？
你只需要一个.page 的容器，它的text-align 应该是center。 IE 无法通过margin 集中block-tag（如divs 或uls）。在答案中查看下面的代码
链接失效了。

【解决方案1】：

在笨浏览器的父容器上使用它：

text-align: center

【讨论】：

【解决方案2】：

你有 RAW php 代码是因为你没有正确配置服务器：

<?php
include('inc/settings.php');
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

通过将 PHP 应用于 *.html 文件来解决该问题，<?php include ?> 不会按字面意思显示。如果我没记错的话，将 .ini 文件中的这一行调整为：

AddType application/x-httpd-php .html .htm .php

因为这个文字后端代码在 DOCTYPE 前面，它会导致 IE 中的 quirks 模式和 quirks 中的水平自动边距无法正常工作。

您可以在父元素上使用 text-align:center ，但这对 IE 来说是一个 hack，您应该通过我上面的建议让 IE 以标准模式呈现它来正确解决这个问题。

【讨论】：

【解决方案3】：

由于标记顶部的这种虚假处理指令，Internet Explorer 以怪异模式显示您的网站：

<?php
include('inc/settings.php');
?>

删除它； margin: auto 在 IE6+ 中工作。没有需要进行text-align: center 或其他不必要的更改。

【讨论】：

【解决方案4】：

这是 IE 中的一个错误！您只需为<div class="page"> 创建一个持有者并将其text-align 设置为center

.page-holder{
    text-align:center;
}
.page{
    margin:0 auto;
}

<div class="page-holder">
    <div class="page">
    page content
    </div>
</div>

【讨论】：

【解决方案5】：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">

您的问题是定义您的文件类型和标准。如果您将此代码添加到文件顶部，它将起作用！

【讨论】：

【解决方案6】：

尝试在父项上使用以下内容。

display: flex;
align-items: center;

【讨论】：

【解决方案7】：

尝试将meta 记录添加到head：

<meta http-equiv="X-UA-Compatible" content="IE=Edge" />

【讨论】：

【解决方案8】：

您可以下载 normalize.css（只需 google 即可）并将其链接到您的项目，现在您可以像这样使用 smth：

HTML：

    <main class="container></main>

CSS：

    .container {
      margin-left: auto;
      margin-right: auto;
      width: 600px;

【讨论】：

【解决方案9】：

对于 IE，将 my-auto 替换为 align-self-center 和 BINGO。您也可以为此编写 CSS：

.center-container{
   align-self: center;
}

【讨论】：