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

[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.

[うなこ]

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

• この返信は2年、 2ヶ月前にうなこが編集しました。

Attachments:

You must be logged in to view attached files.

[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">５つの特徴</span></h2>

Attachments:

You must be logged in to view attached files.

[うなこ]

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

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

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

[投稿者]

投稿