[ 解決済 ] 見出しで左右線を用いてタイトルに折り返し[br-xs]を入れるとモバイルで2ブロックに表示される

VWSとは フォーラム Lightning [ 解決済 ] 見出しで左右線を用いてタイトルに折り返し[br-xs]を入れるとモバイルで2ブロックに表示される

[ 解決済 ] 見出しで左右線を用いてタイトルに折り返し[br-xs]を入れるとモバイルで2ブロックに表示される

  • このトピックには3件の返信、2人の参加者があり、最後にうなこにより1年、 5ヶ月前に更新されました。
4件の投稿を表示中 - 1 - 4件目 (全4件中)
  • 投稿者
    投稿
  • #69417

    tere
    参加者

    ■ WordPress のバージョン
    WordPress 6.0.2

    ■ テーマ・プラグインは全て最新版で確認してください。
    確認しました。

    ■ 子テーマをご利用の場合は親テーマに変更して症状が改善するか確認してください。
    確認しました。

    ■ テーマの種類
    Lightning ( G3 ) + Lightning G3 Pro Unit

    ■ テーマのバージョン
    14.23.2

    ■ Pro Unit のバージョン
    0.23.2

    ■ スキンの種類
    Origin III

    ■ 関連しそうなプラグインを一つづつ停止して症状が改善するか確認してください。
    確認しました。

    ■ 期待する動作
    見出しで左右線を用いてタイトルに折り返し[br-xs]を入れた部分で
    モバイルでは折り返して表示される

    ■ 自分で試した事
    特にありません

    ■ 症状が発生するブラウザ
    clome edge(ともにモバイル)

    ■ 実際の症状
    見出しで左右線を用いてタイトルに折り返し[br-xs]を入れるとモバイルで2ブロックに表示される

    ■ その他特記事項
    不具合ではなく仕様でしょうか?

    Attachments:
    You must be logged in to view attached files.
    #69460

    うなこ
    モデレーター

    色の付け方で横にきてしまっているようです。
    おそらくタイトルのブルーの色は「ハイライト」から入れらレたと思いますが、
    一度その設定をクリアしてから、タイトルを選択して、右横に出るブロックメニューの「色」から色を選択し直してみてください。
    (タイトルが少し長いので、左右線のデザインは見切れてしまうかもしれませんが、、その場合は文字数を調整してみてください)

    • この返信は1年、 5ヶ月前にうなこが編集しました。
    Attachments:
    You must be logged in to view attached files.
    #69469

    tere
    参加者

    うなこ様
    ご回答ありがとうございます。
    ご指摘いただいた方法でこのページに関しては解決しました。
    ただ左右線無の場合、タイトル指定にspanが入る色指定してしまうとブロックになっちゃうみたいなので、下記のような場合は[]など利用した方が無難みたいに思いました(つまり仕様という理解でよいのかも??)。
    <h2 class="is-style-vk-heading-brackets_black"><span data-color="#fcb900" style="background: linear-gradient(transparent 60%,rgba(252, 185, 0, 0.7) 0);" class="vk_highlighter">お客様の満足を追求</span>した[br-xs]キッチン[Kiara][br-xs]<span data-color="#fcb900" style="background: linear-gradient(transparent 60%,rgba(252, 185, 0, 0.7) 0);" class="vk_highlighter">5つの特徴</span></h2>

    Attachments:
    You must be logged in to view attached files.
    #69475

    うなこ
    モデレーター

    返信ありがとうございます
    なるほど!  spanが入ってしまう様な場合は、左右線のCSSの都合上そのようになってしまいますね、、、

    解決法ではないのですが、、
    PCでどうしても左右線にしたい場合は、左右線の見出しと括弧の見出し2つ用意していただき、表示非表示機能でデバイスごとに出しわけする形になるかなと思います🙇‍♂️

    良い案がみつからずすみません、、、よろしくお願いいたします。

4件の投稿を表示中 - 1 - 4件目 (全4件中)
  • このトピックに返信するにはログインが必要です。