Question

我有一个带有侧边栏和内容区域的全宽页面。我需要具有固定宽度值的侧边栏，内容区域宽度是页面的其余部分。正如您在bootply示例中所看到的那样，第二行位于我的侧边栏下，不应该这样。

如果我将.row：before，.row：after {display：table;}更改为table-cell，这个问题看起来已经解决了，但这不是一个合适的解决方案，因为它会导致其他一些问题。

Answer 1

将主要内容包装在自己的部分（或div或内容中，以哪个为准），然后绝对定位两个主要元素。这应该工作。看一看（更新）：

<div class="container">
<aside>MENU SIDEBAR</aside>
<section>
    <div class="row">
        <div class="col-sm-12">FULL WIDTH BOX</div>
    </div>
    <div class="row">
        <div class="col-sm-12">FULL WIDTH BOX</div>
    </div>
</section>
</div>

的CSS：

aside{
  position: absolute;
  width: 200px; 
  height: 500px; 
  background: red; 
  float: left;
}
section{ 
  position: absolute;
  left: 200px;
  padding-left: 100px;
  right: 0; 
}

Bootstrap 3。与Sidebar对齐

1 个答案: