Question

您好，我遇到了简单的CSS问题。我试图通过使用margin-right：auto和margin-left：auto来使我的div标签居中在我的页面上，但它似乎并不是内容的中心。我已经搜索了答案，但我发现最简单的代码没有任何问题。

<html>
<head>

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

<style type="text/css">
body {
    margin-left: 0px;
    margin-right: 0px;
    margin-top: 0px;
    margin-bottom: 0px;
}

#container {
    font-family: Georgia, "Times New Roman", Times, serif;
    background-color: #666;
    height: auto;
    width: 800px;
    margin-top: 0px;
    margin-right: auto;
    margin-left: auto;
}
</style>
</head>
<body>

<div id="container">
Hello world!
</div>

</body>
</html>

Answer 1

将display:table添加到您的#container

#container {
    font-family: Georgia, "Times New Roman", Times, serif;
    background-color: #666;
    height: auto;
    width: 800px;
    margin-top: 0px;
    margin-right: auto;
    margin-left: auto;
    display:table;
}

Answer 2

它可能不适合你的唯一原因是你没有

<DOCTYPE html>

所以页面加载相当于ie5，不支持

margin: 0 auto;

保证金自动不集中内容

2 个答案: