html - Bootstrap 列没有响应

Question

我正在为我的专栏而苦苦挣扎。他们没有回应。当我缩小我的页面以模拟电话查询时，我的列仍在展开，就像页面非常大一样。我会展示一张照片。

我的页脚 HTML(问题所在):

<footer class="footer">
            <div class="container-fluid">
                <div class="row">
                  <a class="col-xs-2 col-md-2" href="{{var protoHost}}PrivacyPolicy">Privacy Policy</a>
                  <a class="col-xs-2 col-md-2" href="{{var protoHost}}TermsOfService">Terms Of Service</a>
                  <a class="col-xs-2 col-md-2" href="{{var protoHost}}AcceptableUsePolicy">Acceptable Use Policy</a>
                  <a class="col-xs-2 col-md-2" href="{{var protoHost}}WarrentyAndReturnsPolicy">Warranty &amp; Returns Policy</a>
                  <a class="col-xs-2 col-md-2" href="{{var protoHost}}ThridPartyCopyrightNotices">Third Party Copyright Notices</a>
                  <a class="col-xs-2 col-md-2" href="{{var protoHost}}TermsOfServicePhone">Terms Of Service For Phone</a>
                 <br><br><br>
                <p>&copy; 2016 Truespeed Internet Services - All Rights Reserved</p>
              </div>
            </div>
        </footer>

我的 CSS:

.footer {
  height: 100px;
  background-color: #277FD8;
  position: absolute;
  bottom: 0;
  width: 1100px;
}
.footer a{
    text-align: center;
    height: 100%;
    color: white;
}
.footer p{
    text-align: center;
    height: 100%;
    color: white;
}

图片:

Answer 1

您的问题是您将页脚设置为 1100px 的静态宽度。

如果您将页脚设置为 width: 100%，则列将响应。