0

所以我正在做一个工作项目。底部的黑色长容器不跨越页面的整个宽度。它在两边都停了几个像素。这是我的代码：

   http://74.117.156.152/~pr0digy/


    <header class="mainHeader">
        <img src="images/uslegalbox.png" alt="usls box" >
    </header>

    <div class="textBox">

            <article class="capexText">
                <h2>Capital</h2><br />
                <h2>Expenditures</h2>
            </article>          

        <div class="buttonsBox">
            <nav><ul>
                <li><a href="#" >New CapEx</li>
                <li><a href="#" >Check Status</li>  
            </ul></nav>
        </div>

    </div>

以及与之配套的 CSS：

body {
        background: url('images/bg.jpg');
        background-size: 100%;
        background-repeat:no-repeat;
        color: #000305;
        font-size: 87.5%; /* Base font size is 14px */
        font-family: Arial; 'Lucida Sans Unicode';
        line-height: 1.2;
        text-align: left;
        width: 100%;    
}

.mainHeader {
        width: 30%
        height: auto;
        margin: 2% 0 0 -1%;
}

.mainHeader img {
        width: 35%;
        height: auto;
}

.textBox {
        margin-top: 10%;
        height: 275px;
        background-image: url('images/buttonsbox.png');
        background-repeat: repeat-x;


}

我确定我只是错过了一些简单的东西，所以任何帮助将不胜感激。谢谢！

4

2 回答 2

0

如果您添加 margin:0; padding:0; 到正文样式，它将重置默认边距和填充为 0。

于 2013-08-06T17:23:58.783 回答
0

确保您使用的是Eric Meyers或Normalize.css之类的重置样式表，因此将所有元素样式设置为默认值。（删除 body/html 填充等）

于 2013-08-06T17:18:49.127 回答