Question

我知道我应该知道如何做到这一点，但是对于我在SO和互联网上的所有搜索，它都在躲避我。朋友想要一个固定宽度居中包装的页面，宽990px。左边和右边没有任何内容，但他希望页眉和页脚像液体布局一样拉伸页面的末端。我从来没有像这样建立网站所以我被卡住了，我只做固定宽度居中包装。

我想用CSS来表达这个，这是他的偏好。

标题不是直黑色，它是一个薄的.png，作为BG图像重复。

页脚是一种坚固的BG颜色。

页面当前设置了正确的页眉和页脚包含在中心包装中，但没有任何内容向左和向右延伸。

页面链接：http://www.jalvisualmedia.com/testsite/mystique/private_label.php

如果我忽略任何有用的信息，请告诉我。

Answer 1

您可以尝试将#wrapperTop和#footer ids放在固定宽度中心包装器之外，并将其宽度设置为100％。

Answer 2

试试这个

#wrapperTop{
    width: 100%;
    height: 162px;
    margin: 0;
}

#navbar {
    height: 40px;
    width: 990px;
    margin: auto;
    background-image: url(../graphics/bg_top.png);
}

#header {
    height: 120px;
    width: 990px;
    margin: auto;
}

#imageSlice {
    width: 990px;
    height: 95px;
    background-color: white;
    margin: auto;
}

#footer {
    width: 100%;
    height: 145px;
    margin: 0;
    background-image: url(../graphics/bg_bottom.png);
}

#navBox {
    width: 600px;
    height: 75px;
    margin: auto;
}

采用液体固定液体设计的布局......似乎无法做到正确

2 个答案: