EC-CUBE4:ヘッダーのカテゴリリストで表示崩れ発生

EC-CUBE4:ヘッダーのカテゴリリストで表示崩れ発生

EC-CUBE4の標準Frameでカテゴリリストの挙動

店舗内カテゴリの登録を終え表示を確認したところ3階層以降のcategoryがプルダウン時に横並びになっていました。

文字数の少ないもの(例えば『鍋』とか)の表記で起こる事を確認。
これはCSSで制御できるだろうと思い場所を探したので備忘録に記します。

管理画面でのカテゴリコントロール箇所

表示されている情報は、管理画面上の『コンテンツ管理>ブロック管理>カテゴリナビPC』です。
しかし、ここにはCSSの記載が無いためカテゴリ関連のスタイルを記載したCSSを探します。

EC-CUBE4TOPページのカテゴリリスト

CSSの記載箇所

カテゴリナビ(PC)に関するスタイルシートは下記フォルダに存在しました。

EC-CUBE保存フォルダ/html/template/default/assets/css/style.css

この4898行目から5026行目がカテゴリのスタイルシートになっています。

Class:ec-itemNav__nav li に追記しコントロールする

場当たり的な処理ですが、以下の変更(追記)で孫カテゴリが横並びする現象が発生しなくなりました。

min-width で設定する値は其々のサイトで異なるかと思います。
また、この処理は一時的な措置であるめ、文字量によって3階層以降の幅が統一されていない状態は解消できていません。そこら辺はまたしっかり作り込むときに探して処理、報告したいと思います。