css - 100%页脚宽度有间隙

Question

我的页脚增长到页面宽度的 100% 时似乎遇到了问题。目前，当它展开时，页脚的每一侧都会有一个间隙。我尝试将页脚放在 wrapper 的外面和里面，几乎得到了相同的结果。我附上了我的代码，看看是否有人能发现我做错了什么。

<div id="wrapper"> <!--Begin Wrapper -->

<div id="riaandoviwrap">
<div id="riaandovi">Ria And Ovi</div>
</div>

<div id="slideshowwrap">
<div id="slideshow"><img src="images/DSC00495.JPG" /></div>
</div>

<div id="slideswrap">
<div id="slide1">SLIDE 1</div>
<div id="slide2">SLIDE 2</div>
<div id="slide3">SLIDE 3</div>
</div>

<hr />

<div id="contentwrap">
<div id="content"></div>
</div>

<div id="footerwrap">
<div id="footerleft">© 2012 Ria and Ovi</div>
<div id="footerright">Share this on:</div>
</div>

</div> <!--End Wrapper -->

body {
    background: #f7f6f6;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 11px;
}
#wrapper {
    width: 100%
}
#riaandoviwrap {
    width: 300px;
    min-height: 150px;
}
#riaandovi {
    font-family: Script;
    font-size: 75px;
}
#slideshowwrap {
    width: 950px;
    background: url(../images/slider-bg2.png);
    clear: both;
}
#slideshow {
    min-height: 350px
}
#slideswrap {
    width: 950px;
    min-height: 100px;
    background: #09F;
    margin-top: 6px;
    clear: both;
}
#slide1 {
    width: 300px;
    float: left;
}
#slide2 {
    width: 300px;
    float: left;
}
#slide3 {
    width: 300px;
    float: left;
}
#contentwrap {

}
#content {

}
#footerwrap {
    min-height: 105px;
    background: url(../images/footer-bg.png);
    margin: 0px;
}
#footerleft {
    width: 350px;
    float: left;
}
#footerright {
    width: 350px;
    float: left;
}
hr {
    max-width: 950px
}
img {
    border: 5px solid #FFF
}

Answer 1

将正文标记的内边距和边距设置为零。尽管您没有手动设置，但浏览器确实有默认的填充/边距。