css 页脚背景在 html5 中没有正确显示

Question

这是我的 CSS 代码:

.footer{
    clear:both;
    background:url('../img/footer-bg.jpg');
    overflow: hidden;
}

.footer-left{
    float:left;
    width: 50%;
}

.footer-right{
    float:right;    
    width:50%;
}
.footer-nav .list-1 {
    font-size:13px;
    font-weight:600;
    text-align: center; 
}
.footer-nav .list-2 {
    font-size:12px;
    font-weight:600;
    text-align: center; 
}
.footer-nav ul li{
    display:inline;
    padding:8px;
}
.copyright{

    font-size:13px;
    text-align: center;

}

这是我的 JSfiddle 链接:http://jsfiddle.net/3jet0dfu/12/

请问如何设置背景图片100%贴屏，页脚内容需要在图片右侧显示。

现在我添加了<hr />顶部和底部的 footer-left 和 footer-right 线。

但它只显示在顶部，任何人都可以帮助我精确的 css 样式来解决这个问题。

我需要看起来像这样 http://s30.postimg.org/gvqtdrmqp/article_page4.jpg .

提前致谢。

Answer 1

添加到 CSS

header,section{
margin:0 auto;
width:939px;}

像这样编辑body css

body{
font-family: Raleway, sans-serif;
 }

此工作页面 jsfiddle