0

我的页面居中存在问题。除了左右边框外,所有内容都正确居中。我相信问题出在border-right-width:300px; border-left-width:300px;线条上,但我不确定另一种设置方式。是否有另一种解决方案来使左右边框也以页面为中心。有任何想法吗?这是我的CSS:

body {    
    margin:auto;
    padding: 0;
    background: #FFFFFF;
    font: 12px/1.4 Verdana, Helvetica, sans-serif;
    font-size: 12px;
    color: #000000;
    border-right-style:solid;
    border-left-style:solid;
    border-right-width:300px;
    border-left-width:300px;
    border-color:#E8E8E8;
}
4

3 回答 3

3

当您使用 margin:auto 时,您还必须指定宽度。我认为您正在尝试以背景#E8E8E8 为主体的内容居中。改为这样做

body {
    margin:auto;
    padding: 0;
    font: 12px/1.4 Verdana, Helvetica, sans-serif;
    font-size: 12px;
    color: #000000;
    width: 1020px; //or anything else you want
    background:#E8E8E8;
}
于 2013-06-03T15:14:05.190 回答
1

您不能将任何没有宽度的东西居中,或者是 100% 的父 div,因为它与任何东西都不相关。

如果你要使用你的身体,你需要这样的东西:

body{
    width:980px;
    height:100%:
}

大多数人所做的是使用容器或包装器。这给了你更多的控制权。

.container{
    width:980px;
    height:100%;
    position:relative;
}

如您所见,我将容器作为类和位置:相对。这允许您在同一页面上多次使用它。

于 2013-06-03T15:21:57.540 回答
-1

您需要将 div 本身居中,如下所示:

div.page {
    margin: 0 auto;
}
于 2013-06-03T15:13:32.470 回答