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