3

サイドバーとコンテンツ領域を含む全幅のページがあります。固定幅の値を持つサイドバーが必要で、コンテンツ領域の幅はページの残りの部分です。bootply の例でわかるように、2 番目の行は私のサイドバーの下に入りますが、そうではありません。

.row:before, .row:after{display: table;} を table-cell に変更すると、この問題は解決したように見えますが、他の問題が発生するため、これは適切な解決策ではありません。

http://bootply.com/89133

4

1 に答える 1

2

メイン コンテンツを独自のセクション (または div またはコンテンツのいずれか) にラップし、2 つの主要な要素を完全に配置します。それはうまくいくはずです。見てください（更新）：

http://bootply.com/89155

<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; 
}
于 2013-10-21T20:07:43.037 に答える