html - 为什么我的背景图像不会重复？

即使设置了repeat-x，是什么导致背景图像不重复？我需要这些电视跨越x轴的宽度，但我无法弄清楚。

#footer{
    clear: both;
    height: 50px;
    padding-top: 15px;
    background-color: black;
    color: white;
    text-align: center;
}

#tvs{
   background-image: url(tvs-627x100.png);
    height: 100px;
    width: 627px;
    background-repeat: repeat-x;}

<div id="footer">
Stop watching TV and write some code!
            </div>

<div id="tvs">
            </div>

我在哪里错了？这也是我的jsfiddle ...

https://jsfiddle.net/dubh09mh/#&togetherjs=pxUyFRivNn

最佳答案

尝试这个：

#tvs{
   background: transparent url(https://cdn.photographylife.com/wp-content/uploads/2014/06/Nikon-D810-Image-Sample-6.jpg) repeat-x left center;
    height: 100px;
    width: 100%;
 }