Vektor WordPress Solution
VWSとは › フォーラム › Lightning › グローバルメニュー下の余白について
Lightning Proを使用しております。トップページで標準のスライドショーを利用せずにMaster Sliderのプラグインを入れてウィジェットの追加で利用いるのですが、その際グローバルメニューからスライダーの画像の間にかなり余白が出ます。
どこかのCSSから調整できるのではと思いますが、場所を教えていただけたらと思います。
一度覚えれば今後様々な所で使えますので一度下記を参考にトライしてみてください。
全てのWordPressテーマで使える!デザインをピンポイントで変更する方法 〜親テーマのCSSは書き換えないで〜
早速のご回答ありがとうございます。
質問が漠然としていたので、画像を添付いたします。
私なりにGooglechromeの検証より見てみたのですが、どこを変更すればいいのかがよくわからなかったので、もし分かるようであればアドバイスお願いいたします。
Lightning Skin Pale をお使いのようですね。
下の少し見えている画像はスライドショーですか? それともページヘッダーですか? いずれにしても私の環境では余白は存在しません。
Lightning Ver. 2.6.3 Lightning Skin Pale Ver. 3.0.6 Lightning Advanced Slider Ver. 0.4.0 ↑あってもなくても関係ないですが一応・・・スワイプ用途には使えます。
上記を最新版にしつつ、スキンを Pale II に変更してみることをおすすめします。 ちなみに、IE は固有のバグが多いため、動作保証の対象外になっているようです。
少しだけ見えている画像が LP の最初の画像と仮定すれば下記コードを編集することで対処可能です。
.siteContent .mainSection, .siteContent .subSection { padding: 30px 15px 10px; } @media (min-width: 768px) { .siteContent .mainSection, .siteContent .subSection { padding: 30px 20px 10px; } } @media (min-width: 992px) { .siteContent .mainSection { padding: 30px 30px 10px; } } @media (min-width: 1200px) { .siteContent .mainSection { padding: 40px 40px 20px; } }
padding には書き方が色々あるので下記サイトを参考にしてみてください。
padding-スタイルシートリファレンス
RICKさん
ご丁寧な回答ありがとうございます。
こちらの情報不足で申し訳ないのですが、現状以下のような組み合わせです。
Lightning Ver. 2.6.4 Lightning Skin Pale Ver. 3.0.6 Master Slider Ver. 3.5.3(スライドのサムネイルが出るため、クライアントからの要望でこれを使っています)
編集コードも記載いただきありがとうございます。
ちなみにこちらはどこから入ればよろしいでしょうか。
お手数おかけしますが、よろしくお願い致します。 念のためさらに広い範囲の画像を添付します。
ちなみにMaster Sliderは、ウィジェットよりカスタムHTMLでトップページコンテンツエリア上部に入れております。
ちなみに Master Slide rは、ウィジェットよりカスタム HTML でトップページコンテンツエリア上部に入れております。
下記コードを編集後下記のいずれかに設置してください。
.siteContent { padding: 1em 0 1.5em; } @media (min-width: 768px) { .siteContent { padding: 3.5em 0 3.5em; } }
ありがとうございました。