/ ブートストラップ3の小さな画面での固定/ナビゲーションのナビゲーション - css、twitter-bootstrap-3

ブートストラップ3の小さな画面に貼り付けるナビゲーション - css、twitter-bootstrap-3

Bootstrap 3で遊んでいますgetbootstrapサイトで使用されている垂直ナビゲーションバーを複製します。私はいくつかの問題に遭遇しています、そして私は仕事をするための多くの文書を見つけていません。

ここに私がどこから来たのかを示すためのbootplyリンクです: http://bootply.com/77832

問題番号1は、画面を変更した場合です。サイズが大きいものから小さいものまで、ナビゲーションは現在私のテキストの下にあります。しかし、ブートストラップサイトでは、ナビゲーションは画面の一番上に移動し、その下にテキストが表示されます。これを小さい画面でサイズ変更したり表示したりしてもレイアウトが壊れないようにするには、どうすればよいでしょうか。

問題番号2は化粧品です。 「テキストの幅だけではなく、コンテナ全体を埋め尽くすためにナビゲーションのきれいなピンク色の背景が欲しいのです。だから私はちょっと幅を入れていたと思いました。私はそれがそれを含むcol-md-3の100%を埋めるだろうと思いました、しかしそれは実際にはスクリーン幅の100%を埋めます。なぜそれが入っているcol-md-3からはみ出して、どうやって望みの外観を達成することができるのでしょうか?

回答:

回答№1は1

#2の場合、問題はULに位置があることです。基本的にボディを親として扱うので、width:100%はページと同じ幅になります。

#1の場合、ページが小さくなったら、ナビゲートをページの横に「貼り付けない」ようにします。