ヘッダーメニューがはみ出てしまう

ul.hamburger-menu-list-grouppadding-left: 182px;という大きな余白を取っているので、各要素の幅の合計+182px より画面幅が狭くなればはみ出します。
まずはこれを削除しましょう。

画面幅が広いときに、ロゴとナビメニューの間に余白を取りたいなら、下記のようにロゴの左余白をautoにすればいいでしょう。

css

1.header-logo {2 margin-right: auto; 3}

ただし、各要素の幅の合計より画面幅が狭くなればまたはみ出しますので、その場合はメディアクエリを使って、フォントを小さくするとか、レイアウトを変更するとかして対処することになります。

コメントを投稿

0 コメント