html - 滚动时 Bootstrap 3 背景颜色问题..？

Question

我在 Bootstrap 中遇到了一些问题，我开发了网站，但是在网站完成后客户说他们不想响应式网站。

所以，我首先将 .container 的宽度固定为 960px !important;

它会工作..!!但问题是我也在使用 .row 类，每个行类正在做出响应，它包含......

我想在页脚处使用 100% 宽度的背景，但是当我调整浏览器大小时并水平滚动时，它会删除背景颜色。

我能做什么...

参见网站: Snapshot 1

当浏览器调整大小时，然后查看发生了什么问题: Snapshot 2

我的 html 代码是用 bootstrap 3 编写的:

<footer>    
<div class="row footercolor">
        <div class="container">  
        <div class="row">
            <div class="col-xs-2 ">
                  <div class="row">
                  <h5 class="undr footertitle">Lorem Ipsum</h5>
                 </div>
             </div>

             <div class="col-xs-3">
              <div class="row">
                  <h5 class="undr footertitle">QUICK LINKS</h5>
                  <div class="col-xs-6">                  
                      <ul class="footerlist list-group">

                       </ul>
                  </div>     
                  <div class="col-xs-6">  
                       <ul class="footerlist list-group">

                       </ul>
                  </div>
                  </div>
             </div>

             <div class="col-xs-4">
             <div class="row">
               <h5 class="undr footertitle">OUR NEIGHBORHOODS</h5>
                   <div class="col-xs-6">                     
                      <ul class="footerlist list-group">

                       </ul>
                   </div>
                   <div class="col-xs-6">                      
                       <ul class="footerlist list-group ">

                       </ul>
                  </div>
             </div>
             </div>
             <div class="col-xs-3">
                  <div class="row">
                        <h5 class="undr footertitle">GET WEEKLY LISTING UPDATES</h5>
                        <div class="input-group">
                          <input type="text" class="form-control">
                          <span class="input-group-addon btn-ftrbtn">Add Me</span>
                        </div>              
                  </div>
                  <div class="row"><br/></div>
                  <div class="row">
                        <ul class="list-unstyled list-inline pull-right">
                            <li><a href="#"><img src="img/fb.png"></a></li>
                            <li><a href="#"><img src="img/twitter.png"></a></li>
                            <li><a href="#"><img src="img/pintrest.png"></a></li>
                        </ul>                                     
                  </div>      
              </div>
          </div>
    </div>
    </div> <!-- /container -->
</footer>

& 我的 CSS 代码是:

.footercolor {
    background-color: #5e6872;
}
.footer{color:#c6c6c9}

.footertitle {
    font-family: 'myriad_prosemibold_condensed' !important;
    font-size: 13px!important;
    color: #fff !important;
    letter-spacing: 0.5px;
}
.footerlist li a {
    font-family: 'myriad_prolight_semicondensed' !important;
    font-size: 12px!important;
    color: #c6c6c9 !important;
    text-decoration: none
}
.footerlist li a:hover {
    color: #fff !important;
    cursor: pointer
}

.row {
    margin-left: 0 !important;
    margin-right: 0 !important; 
}
.container{min-width:960px !important;}

最后请给我解决方案...任何帮助将不胜感激...

Answer 1

将以下代码添加到您的 CSS 文件将解决此问题。

html, body {
 min-width:960px;
}