将图像并排放置在具有一个重复尺寸和一个固定尺寸的流体页脚中

Question

我正在更新网站的布局。我想保留模板1中的页眉和页脚图像并将它们合并到模板2中，但是，模板2的设计有点不同。

在原始模板中，页脚包含2张图片。两幅图像的高度均为203像素。图像1是非重复的，宽度为950px。图像2用于填充宽度。这是可重复的。我尝试过无数种方式编码，最接近我的方式，使图像2填满整个底部覆盖图像1.我尝试过只使用图像1，但它没有扩展正常。

CSS：

#footer{
   background: url(../linkto/imageR.png) left 0px repeat-x; 
   background: url(../linkto/image.png) right 0px no-repeat width 950px;
   height:203px;
   text-align: center;
}

HTML

<div id="footer" class="container-fluid">
    <div class="container">
        <div class="col-xs-12 row-title">
            <br> &nbsp;      <h4>Default Text</h4>
        </div>
    </div>
    <div class="row main-footer-content">
        <p>More text here.</p>
    </div>
    <div class="row">
        <div class="col-xs-12 col-md-3">
            <div class="contact-box">
                Contact info
            </div>
        </div>
        <div class="col-xs-12 col-md-3">
            <div class="contact-box">
                More info
            </div>
        </div>
        <div class="col-xs-12 col-md-3">
            <div class="contact-box">
                another column
            </div>
        </div>
        <div class="col-xs-12 col-md-3">
            <div class="contact-box">
                last column
            </div>
        </div>
    </div>
</div>