副項目の表示について

  • 解決済 Chanchan.

    (@eureka20080321)


    5年前

    いつも大変お世話になっております。

    テーマはbeauti_plusで子テーマを作成し、カスタマイズしています。

    ブログを２種類展開しています。
    メインメニューにBLOGというメニューを作り、そこに副項目で２種類分けてあるのですが、画面サイズによって副項目の文字が途中で切れてしまいます。

    これをどの画面サイズでも途中で切れずに、全て表示させる方法はあるでしょうか？

    私のアイデアでは、メニュー全体のフォントサイズを小さくする程度しかありません。

    皆さま、よろしくお願いします。

    ヘルプの必要なページ: [リンクを見るにはログイン]

6件の返信を表示中 - 1 - 6件目 (全6件中)
  • CG

    (@du-bist-der-lenz)

    5年前

    メニューの項目が表示される領域に余裕が無いようにしていませんか。

    トピック投稿者 Chanchan.

    (@eureka20080321)

    5年前

    CGさま。

    いつも気にかけていただき、ありがとうございます。

    ご指摘をいただき、領域？を自分なりに見てみました。

    sitenavのtext-alignをcenterからleftに代えるとメニューの文字全体が左に移動し、場所の確保はできそうですが、希望はセンターのまま。

    containerのwidthの%を代えるとメニューが２段になり、やはり場所の確保はできそうですが、希望は１段のまま。

    メニュー項目の数の多さから、どれかを諦めないとならないでしょうか？

    よろしくお願いします。

    CG

    (@du-bist-der-lenz)

    5年前

    メニューの項目が多いことから、起こっているってことですね。「画面サイズによって」とは具体的にどうなのでしょう。タブレット以下になると、プルダウンメニューに変化するので不便はないと思えますが。

    @eureka20080321 さんの状況に追従して、比較確認のためにbeauti_plusテーマを使って試しています。

    https://plus.kobatoradio.info/

    トピック投稿者 Chanchan.

    (@eureka20080321)

    5年前

    CGさま。

    やはりそうですか!!納得しました。

    タブレットで通常はプルダウンとなるので良かったのですが、ダブレットを横にさせると文字のメニューとなり切れてしまっていました。
    もう少し、考えて対処してみます。

    話がズレてはいけないと分かってはいるのですが、試しに作られたページの固定ヘッダーはどのようにされたのですか？

    header {
position: fixed 
}

    ですとレイアウトが崩れてしまいました。
    ぜひ参考にさせてください。

    ishitaka

    (@ishitaka)

    5年前

    副項目の位置を左にずらすだけであれば、下記の CSS でできると思います。

    .sitenav ul li:hover ul { left: -100px; }

    ※ -100px の値は、適当に調整してください。

    トピック投稿者 Chanchan.

    (@eureka20080321)

    5年前

    ishitakaさま。

    いつも本当にありがとうございます。
    おかげさまで、希望通りにすることが出来ました。

    日の浅い私には、はじめて拝見するコードでしたので、少し勉強させていただきます！

6件の返信を表示中 - 1 - 6件目 (全6件中)
  • トピック「副項目の表示について」には新たに返信することはできません。