为啥边距 0 自动不居中，即使有规定的宽度？
Posted
技术标签:
【中文标题】为啥边距 0 自动不居中，即使有规定的宽度？【英文标题】：Why is margin 0 auto not centering, even with a stated width?为什么边距 0 自动不居中，即使有规定的宽度？ 【发布时间】：2019-05-10 20:20:18 【问题描述】：我的页面没有居中，我尝试使用width: 980px; 来修复页面没有居中，只需说明容器/包装器的大小。
我应该提一下，我正在使用来自 Web Expression 4 的 DWT（动态 Web 模板）。
主体：
<body>
<div id="wrapper">
<div>
<div id="bannerTop" style="position: absolute; width: 980px; height: 10px; z-index: 3; left: 0px; top: 0px" class="auto-style1">
</div>
<div id="banner" style="position: absolute; width: 980px; left: 0px; top: 17px; height: 100px; z-index: 1">
<img src="images/remax_logo.png" ></div>
</div>
<div id="topNav" style="position: absolute; width: 980px; height: 50px; z-index: 2; left: 0px; top: 117px">
<ul>
<li><a href="index.html">Home</a></li>
<li><a href="switchboard.html">Switchboard</a></li>
<li><a href="properties.html">Property Page</a></li>
<li><a href="contact.html">Contact Us</a></li>
<li><a href="credits.html">Sitemap / Credits</a></li>
</ul>
</div>
<div id="sideNav">
</div>
<!-- #BeginEditable "content" -->
<div id="content" style="position: absolute; width: 777px; height: 563px; z-index: 5; left: 215px; top: 209px">
</div>
<!-- #EndEditable -->
<div id="footerNav" style="position: absolute; width: 995px; height: 49px; z-index: 6; left: 0px; top: 773px">
<ul>
<li><a href="index.html">Home</a></li>
<li><a href="switchboard.html">Switchboard</a></li>
<li><a href="properties.html">Property Page</a></li>
<li><a href="contact.html">Contact Us</a></li>
<li><a href="credits.html">Sitemap / Credits</a></li>
</ul>
</div>
</div>
</body>
CSS：
body
font-family: Arial, Helvetica, sans-serif;
background-color: #F2F2F2;
#wrapper
width: 980px;
margin: 0 auto;
background-color: #FFFFFF;
【问题讨论】：
试试这个答案：***.com/questions/963636/… 去除不必要的混乱，只展示与问题本身相关的部分。说清楚。 @DeDee 清理了不少。 请做一个sn-p 【参考方案1】：定位问题：
#wrapper
width: 980px;
margin: 0 auto;
background-color: #FFFFFF;
position: relative; /* this fixes it */
【讨论】：
以上是关于为啥边距 0 自动不居中，即使有规定的宽度？的主要内容，如果未能解决你的问题，请参考以下文章