100%页脚宽度有Gap

Question

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

<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

将body标记的填充和边距设置为零.虽然你没有手动设置,浏览器确实有默认的填充/边距.