バグ報告Ver.2.9.1→2.9.2

現象

Safari（iPhoneXr）のみ、レイアウトが崩れ表示される（図1参照）。
エントリーカードが少ないとき、このような現象が発生し、エントリーカードがページネーションと重なってしまう。

原因

根本原因不明。

対策

• 暫定対策（案1）
  display: flex;をdisplay: grid;に変更すると、問題が発生しない。

cocoon/skins/skin-made-in-heaven/style.css at 2bffde0b446cad478d5848f414cd56cf986e235d · xserver-inc/cocoon

100％GPLの無料WordPressテーマです。開発中の開発バージョンです。安定版をダウンロードする場合は、Cocoon配布サイトからダウンロードしてください。 - xserver-inc/cocoon

github.com

• 暫定対策（案2）
  <figure>タグにaspect-ratioを指定しているが、これを<img>タグに変更すると問題が発生しない。

cocoon/skins/skin-made-in-heaven/style.css at c94460231b41838ebb02aa127a33538ed9f871c1 · xserver-inc/cocoon

100％GPLの無料WordPressテーマです。開発中の開発バージョンです。安定版をダウンロードする場合は、Cocoon配布サイトからダウンロードしてください。 - xserver-inc/cocoon

github.com

• 対策
  変更量の少ない案1を採用し、以下のコードに変更する。

.body .main {
  background-color: transparent;
  border: 0;
  border-radius: 0;
  display: grid;
  gap: var(--gap30);
  grid-template-columns: minmax(0, 1fr);
  margin: 0;
  padding: 0;
}

変更一覧