我有一个带有侧边栏和内容区域的全宽页面。我需要具有固定宽度值的侧边栏,并且内容区域的宽度是页面的其余部分。正如您在 bootply 示例中看到的那样,第二行位于我的侧边栏下方,这不应该。
如果我将 .row:before, .row:after{display: table;} 更改为 table-cell,这个问题看起来已经解决了,但这不是一个合适的解决方案,因为它会导致一些其他问题。
我有一个带有侧边栏和内容区域的全宽页面。我需要具有固定宽度值的侧边栏,并且内容区域的宽度是页面的其余部分。正如您在 bootply 示例中看到的那样,第二行位于我的侧边栏下方,这不应该。
如果我将 .row:before, .row:after{display: table;} 更改为 table-cell,这个问题看起来已经解决了,但这不是一个合适的解决方案,因为它会导致一些其他问题。
将主要内容包装在它自己的部分(或 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;
}