カテゴリバナーのサイズ変更

[PaulinaMX (ForosMX)]

フォーラムのアップデート後、モバイル版のカテゴリバナーがボックスからはみ出してしまうのですが、バナーのサイズを修正すれば解決するのではないかと考えています。

どなたか助けていただけないでしょうか？

よろしくお願いします。

[PaulinaMX (ForosMX)]

[Don]

こんにちは。

このCSSが原因だと思います。

.category-logo.aspect-image {
  width: calc(var(--max-height) * var(--aspect-ratio));
}

ここでmax-heightは150pxで、アスペクト比は画像によって異なります。アスペクト比が6の画像の場合、幅は150 x 6 = 900pxになります。つまり、画像のアスペクト比に依存します。

しかし、この計算は以下のように上書きできます…（これではありませんが、影響します）。
画像に固定のmax-widthを追加します。これにより、画像はこの値よりも幅が広くなることはありません。
モバイルCSSセクションに以下を追加します。

.category-list .category-logo.aspect-image {
  max-width: 250px;
}

---

または、モバイルでは次のようなことを試すことができます。ビューポートの最大幅を計算し、画像がそれに合わせて配置されます。

.category-list .category-logo.aspect-image {
  max-width: calc(100vw - 2.5em);
}

[PaulinaMX (ForosMX)]

@Don 本当にありがとうございます。これで素晴らしい見た目になりました！