Twenty Twenty-Two 2 画像の上部に余白を入れる

画像とギャラリーの上部のブロックの間に余白がなくてとても見にくかったので、マージンを入れました。

理想的には、テーマが準備した変数を使うのがよさそうですが、一番小さい余白設定が想像以上に大きかったので、値で指定しました。

変数を使った例

外観 → カスタマイズ → CSS追記

.wp-block-image {
	margin-top: var(--wp--custom--spacing--small, 1.25rem);
}

他のSpacing変数

上記のCSSコードの「small」の部分を「medium」などに帰ると、もっと広くなります。

Spacing変数	規定値
small	max(1.25rem, 5vw)
medium	clamp(2rem, 8vw, calc(4 * var(–wp–style–block-gap)))
large	clamp(4rem, 10vw, 8rem)
outer	var(–wp–custom–spacing–small, 1.25rem)

値を使った例

外観 → カスタマイズ → CSS追記

.wp-block-image {
	padding-top:1.25rem;
}

「1.25rem」(=1.26 x 16px)ですから、好きに数値を変えてみてください。

こんなもんかな?