BootstrapでNavBar(ナビゲーションバー)を横方向(水平方向)にスクロールできるようにする

BootStrap v4.0でNavBarを横方向にスクロールできるようにしたかったのでメモ.

すなわちhorizontalな方向へのスライドができるようにする.

nav classとなっているdivに対して、

overflow-x:scroll;

overflow-y:hidden;

flex-wrap: nowrap;

の要素を加えるだけ.

今回は各nav-itemはmin-width:200pxとしています.

全体のコードとしてはこんな感じ.

 

About the author

コメントを残す