今回はメニューのカスタマイズその2として、前回の方法でメニューを追加しすぎた場合、レイアウトが崩れてしまいます。
今回はcssを調整することで解決してみようと思います!
変更するファイルは、
/resources/styles.css
です。共通で使われるので、全般に渡るスタイル変更はこちらで大丈夫です。
/resources/styles.cssの最後の行に下記を追加します。
.navbar .nav > li > a { padding: 10px 5px 11px; }
メニューの左右余白を「10px」から半分の「5px」へ変更しています。
崩れ幅によって変更して下さい。
これでキレイに収まりました。