プロパティ padding-block-end

プロパティ padding-block-end は、要素のブロック（垂直）軸方向の終端の内側の余白を設定します。

構文

セレクタ {
	padding-block-end: サイズ;
}

例

子要素のブロック軸方向の終端の内側の余白を20pxに設定してみましょう:

<div>
	<p>text</p>
</div>

div {
	width: 400px;
	height: 200px;
	border: 1px solid black;
}
p {
	padding-block-end: 20px;
	width: 100px;
	height: 50px;
	border: 1px solid red;
}

例

次に、子要素のブロック軸方向の終端の内側の余白を20%に設定してみましょう:

<div>
	<p>text</p>
</div>

div {
	width: 400px;
	height: 200px;
	border: 1px solid black;
}
p {
	padding-block-end: 20%;
	width: 100px;
	height: 50px;
	border: 1px solid red;
}

関連項目

プロパティ padding-block-start,
これは要素のブロック軸方向の始端の内側の余白を設定します
プロパティ padding-inline-end,
これは要素のインライン軸方向の終端の内側の余白を設定します
プロパティ padding-inline-start,
これは要素のインライン軸方向の始端の内側の余白を設定します
プロパティ padding,
これは内側の余白を設定します
プロパティ margin-bottom,
これは下側の外側の余白を設定します
プロパティ margin-left,
これは左側の外側の余白を設定します
プロパティ margin-right,
これは右側の外側の余白を設定します
プロパティ margin,
これは外側の余白の一括指定プロパティです