时间戳

首页 > 解决方案 > 为什么边距 0 自动不居中，即使有规定的宽度？

html - 为什么边距 0 自动不居中，即使有规定的宽度？

问题描述

我的页面没有居中，我尝试使用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 alt="Remax Logo" height="97" src="images/remax_logo.png" width="519"></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;

}

标签： htmlcss

解决方案

定位问题：

#wrapper{
    width: 980px;
    margin: 0 auto;
    background-color: #FFFFFF;
    position: relative; /* this fixes it */
}

推荐阅读