現在の Bootstrap バージョン (3.3.2) では、ナビゲーション用の固定サイドバーを実現する優れた方法があります。
このソリューションは、再導入されたコンテナ流体クラスでもうまく機能します。つまり、レスポンシブなフルスクリーン レイアウトを簡単に実現できます。
通常、固定の幅とマージンを使用する必要があります。そうしないと、ナビゲーションがコンテンツに重なってしまいますが、空のプレースホルダー列を使用すると、コンテンツは常に適切な場所に配置されます。
以下の設定では、ウィンドウのサイズを 768px 未満に変更して固定ナビゲーションを解放すると、コンテンツがラップされます。
実際の例については、http://www.bootply.com/ePvnTy1VIIを参照してください。
CSS
@media (min-width: 767px) {
#navigation{
position: fixed;
}
}
HTML
<div class="container-fluid">
<div class="row">
<div id="navigation" class="col-lg-2 col-md-3 col-sm-3">
<ul>
<li><a href="#">Link 1</a></li>
<li><a href="#">Link 1</a></li>
<li><a href="#">Link 1</a></li>
</ul>
</div>
<div class="col-lg-2 col-md-3 col-sm-3 hidden-xs">
<!-- Placeholder - keep empty -->
</div>
<div id="main" class="col-lg-10 col-md-9 col-sm-9 fill">
...
Huge Content
...
</div>
</div>
</div>
https://stackoverflow.com/a/28238515/3891027で私の回答を参照してください。