Question

我正在使用Bootstrap v3.3.7的网站上工作。但是，当我进入移动视图时，行会超出屏幕宽度时出现问题。并导致设计出现问题我的div结构是这样的

<div class="container">
<div class="row" id="something">
   <div class="col-lg-3 col-md-3 col-sm-12 col-xs-12" id="left-side">
       <div class="row">
         <div class="col-sm-5 col-xs-5" ></div>
         <div class="col-sm-7 col-xs-7" ></div>
        </div>
  </div>
 <div class="col-lg-9 col-md-9 col-sm-12 col-xs-12">
     <div class="row">
      <div class="col-lg-3 col-md-3 col-sm-4 col-xs-6"></div>
      <div class="col-lg-3 col-md-3 col-sm-4 col-xs-6"></div>
      <div class="col-lg-3 col-md-3 col-sm-4 col-xs-6"></div>
      <div class="col-lg-3 col-md-3 col-sm-4 col-xs-6"></div>
      <div class="col-lg-3 col-md-3 col-sm-4 col-xs-6"></div>
      <div class="col-lg-3 col-md-3 col-sm-4 col-xs-6"></div>
      <div class="col-lg-3 col-md-3 col-sm-4 col-xs-6"></div>
      <div class="col-lg-3 col-md-3 col-sm-4 col-xs-6"></div>
      <div class="col-lg-3 col-md-3 col-sm-4 col-xs-6"></div>
     </div>
 </div>

</div>

任何人都可以帮我解决这个结构的问题以及为什么滚动条会出现在页面底部？我想提一下，当我添加

#something{margin:0px}

然后解决问题

抱歉，出于某些特定原因，我无法分享我的确切代码。 ty

Answer 1

是的，对于bootstrap中的行，默认左边和右边的边距是-15px，以覆盖外部div左右两侧的区域（从外部div的左右两侧填充15px），也许它可能是容器或任何col div所以如果你删除这个边距，网站的结构将不会对齐，并在移动设备的底部创建一个滚动条。所以请在移动宽度上删除#something {margin：0px}。如果要隐藏底部的滚动条，请添加css：体（溢出 - X：隐藏;）

如果有任何其他问题，请告诉我。

移动设备上的bootstrap响应问题

1 个答案: