WordPressテーマ「Cocoon」の画像ギャラリー表示をカスタマイズしました

WordPressで画像を複数枚アップするとき、ギャラリー機能をよく使うのですが、下図のように、最後の写真だけ100%幅になってしまうのが不満でした。

そこで「カスタマイズ」の追加CSSのところに

.wp-block-gallery.has-nested-images figure.wp-block-image {
    flex-grow: 0;
}

を追加して、下図のように調整しました。
ギャラリー画像にかかっていたCSS「flex-grow」を「0」つまりオフにすることで、100%幅にならないようにした、という感じです。

今回の調整に使用した「flex-grow」についての詳細は、下記をご参照ください。
≫【CSS】flex-growを使おう #CSS – Qiita

何かのご参考になれば幸いです。

タイトルとURLをコピーしました