VWSとは フォーラム Lightning 2カラム以上で、縦並びになると上下のカラムがくっつく

2カラム以上で、縦並びになると上下のカラムがくっつく

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

    msuzu
    参加者

    Lightning Skin Varietyを使用しています。
    カラムブロックで2カラム以上を設定した場合、横並びではカラム間に隙間があるのですが、モバイル等で縦並びになるとカラムの上下に隙間がなくなり、ぴったりとくっついてしまいます。
    以前からこのようになっていましたでしょうか?
    もしそうであれば上下の隙間を開ける方法を教えてください。
    よろしくお願いします。

    Lightning Pro バージョン: 3.2.2
    Lightning Skin Variety バージョン 6.0.3

    追記:改めて確認しましたが、他のテーマにすると、縦並びで上下のカラムの隙間が空きます。lightningのバグでしょうか?

    • このトピックはmsuzuが10ヶ月、 1週前に変更しました。
    #31684

    Vektor,Inc
    キーマスター

    余白についてはスペーサーブロックで任意に追加出来ますが、一度仕様を再確認して改めて返信いたします。

    #31745

    msuzu
    参加者

    ご回答ありがとうございます。
    こちらの説明が不十分だったようです。
    ブロック・レイアウト要素の「カラム」を使って、そのブロック内に2カラム以上のカラムを設定し、
    画像等をレイアウトします。
    PC等の大きめのディスプレイでは各カラムの間に隙間ができ横並びしますが、
    モバイル等の小さなディスプレイでレスポンシブルで縦に並ぶと、今まで上下に隙間があったのが、
    隙間が無くなりレイアウトされます。
    この症状はwordpressのバージョンが5.3.2になってからです。
    テーマをTwenty Twentyにすると同じレイアウトでも上下に隙間ができます。
    参考の画像を添付します。

    度々の問い合わせでお手数をおかけしますが、ご検討のほどよろしくお願いします。

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

    DRILL LANCER
    モデレーター

    どうやらWordPress のコア側で.wp-block-columnに下マージンが設定されていないのが原因のようです。
    開発者ではない私としては応急処置として下記 CSS コードを下記のいずれかに記述することを提案します。

    • 子テーマの style.css
    • 外観 > カスタマイズ > 追加CSS
    • ExUnit > CSS カスタマイズ
    .wp-block-column {
    	margin-bottom:1em;
    }

    1em の部分は適当に決めたので、40px 等適当な値に変えてください。

    #31749

    Vektor,Inc
    キーマスター

    この件、仕様の判断が難しいですね。
    1カラム時に下部に余白をつけてしまうと、余白をなしにしたい場合にcssを手書きしないといけなるので、手動でスペーサーブロックを入れた方が好みの余白に出来るけれども、
    現実には毎回スペーサーブロック入れるよりも適当に余白が空いた方が楽な場面が多い。
    でも余白入れてしまうと余白なしにしたい時にやりにくい…

    と、言うことで、余白アリ、ナシを制御出来るように機能追加を検討しますが、他の優先実装事項もありますので、当面は上記のコードを記載いただくか、レスポンシブスペーサーブロックなどを左側のカラムの最下部などに配置して対応お願いできればと思います。

    #31750

    msuzu
    参加者

    DRILL LANCER様、Vektor,Inc. 様 ご回答ありがとうございました。諸々了解しました。今後ともよろしくお願いします。

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