- このトピックには8件の返信、2人の参加者があり、最後に
により5年、 10ヶ月前に更新されました。
-
投稿
-
ウィジェットのWPAW:スライダーの写真の大きさ（高さ）が、
コードを見ると
<div class="slick-list draggable" style="height: 1109px;">
となっていて、htmlで高さが指定されているので、
CSSだけの上書きでうまくいかないのですが、
どこを変更すると高さを変えられますか？
教えてください。よろしくお願いします。いいねをした人: 居ません.slick-listのheightは、.slick-slide の高さを見て自動的に設定されるようです。高さをどう変更したいかによりますが、下記のような感じでどうでしょうか？.wpaw-slider .slick-slide { max-height: 400px; }ちなみに、ピックアップスライダー、スライダーウィジェットの高さ指定は、横幅のそれぞれ違うサイドバーやフロントページに設置しても、また、スマホでも PC でも変にならないように、結構複雑な指定になってしまっています。なので、トップページにだけ設置していてそれをカスタマイズしたい、ということなら上記のような CSS で問題ないと思いますが、サイドバーにも使っているとかであれば、もうちょっとセレクタを工夫する必要があるかもしれません。
※あと、この書き込みのおかげで明らかな CSS の記述ミスを見つけました。ありがとうございます！
いいねをした人: 居ません回答ありがとうございます！
ひとまず、PC版のサイズが変えられれば
何とかなりそうなので、助かりました^^スマホなどでの調整で詰まったら、
また質問させてもらうかもしれませんが、
よろしくお願いします><見つかってよかったですねー^^
いいねをした人: 居ません3.1.2 でスライダーの仕様が変更になりまして、これまでトップページではスライダーウィジェットの高さが 70vh だったのが、どこに設置しても 16:9 のアスペクト比で表示する（ただし中身のタイトルなどが長い場合はその分縦に伸びる）、というようになりました。
その影響で、前述したコードは正しく適用されなくなりました。
3.1.2 以降の場合、下記のような感じでどうでしょうか？.wpaw-slider .wpaw-slider__item { min-height: 540px !important; }.wpaw-slider .slick-slideではなく.wpaw-slider .wpaw-slider__itemの CSS を上書き.wpaw-slider .wpaw-slider__itemのmin-heightを好きな高さで固定
いいねをした人: 居ません回答ありがとうございます。
min-heightで、自分のやりたいように、うまく行かなかったので、.wpaw-slider .wpaw-slider__item { min-height: initial !important; max-height: 540px; /* 好きな高さ */ }という形で、min-heightを打ち消して、
元々、指定していたmax-heightの指定を生かすという方法だと前の表現にできました。ちょっと強引なやり方ですかね・・・
いいねをした人: 居ませんさっきのコードだと、余白が変なことになっていたので、
打ち消して、前回のCSSをかけるという方法だとうまくいきました。.wpaw-slider .wpaw-slider__item { min-height: initial !important; } .wpaw-slider .slick-slide { max-height: 540px; /* 好きな高さ */ }いいねをした人: 居ませんもしかしたらですが、
.wpaw-slider .wpaw-slider__item { min-height: 540px !important; }以外の slick の要素（
.slick-slideとか.slick-trackとか）にもスタイルを追加されてたりしませんかね？いいねをした人: 居ません
- トピック「sliderの写真の大きさ（高さ）を変更したい。」には新しい返信をつけることはできません。