html - 在 ie9 中 Bootstrap 空白空间

Question

<section class="content">
 <div class="row">
  <aside class="hidden-xs hidden-sm col-md-1 col-lg-1 fixed-left-bar">
   <span class="about">about</span>
  </aside>
  <div class="col-xs-12 col-sm-12 col-md-8 col-lg-8 content-container">
   <div class="hidden-xs hidden-sm col-md-6 col-lg-6 background"></div>
  </div>
  <aside class="hidden-xs hidden-sm col-md-3 col-lg-3 fixed-right-bar">
  </aside>
 </div>
</section>

div.background 应该放在 aside.fixed-right-bar 旁边，但是 page 做滚动条。在 chrome 中成功运行。我怎样才能删除那个空格？

Answer 1

这是因为 .row 调用，左右两边都取负边距。

.row {
    margin-right: -15px;
    margin-left: -15px;
}

将您的代码包装在 container 或 container-fluid 类中。

<section class="content container-fluid">
 <div class="row">
  <aside class="hidden-xs hidden-sm col-md-1 col-lg-1 fixed-left-bar">
   <span class="about">about</span>
  </aside>
  <div class="col-xs-12 col-sm-12 col-md-8 col-lg-8 content-container">
   <div class="hidden-xs hidden-sm col-md-6 col-lg-6 background"></div>
  </div>
  <aside class="hidden-xs hidden-sm col-md-3 col-lg-3 fixed-right-bar">
  </aside>
 </div>
</section>