【CSS Modules】padding-inline-endプロパティの使い方

padding-inline-endプロパティは、要素のインライン方向の末尾に設定される内側の余白の量を保持するプロパティです。このプロパティは、テキストが書かれる方向の「終わり」側にパディング（内側の余白）を設定するために使用されます。例えば、英語や日本語の横書きのように左から右へテキストが進む環境では、要素の右側にパディングが適用されます。一方、アラビア語やヘブライ語のように右から左へテキストが進む環境では、要素の左側にパディングが適用されます。

このプロパティの最大の特徴は、従来のpadding-rightやpadding-leftといった物理的な方向を指定するプロパティとは異なり、Webページの書き込みモード（writing-mode）やテキストの方向（directionプロパティ）に応じて、パディングが自動的に適切な位置に適用される点にあります。これにより、異なる言語や表示方向を持つコンテンツを開発する際に、物理的な方向を個別に指定し直す手間が省け、コードの保守性や再利用性が大幅に向上します。

特に、国際化対応（i18n）や多言語対応が必要なWebサイトを構築する際に非常に有用であり、開発者は言語ごとにスタイルシートを調整する複雑さを軽減できます。値は、ピクセル（px）、em、remなどの長さの単位、またはパーセンテージ（%）などで指定することが可能です。padding-inline-endは、Webサイトのレイアウトをより柔軟かつ効率的に管理し、グローバルな利用者に対応するための重要なツールとして機能します。

Copy
1padding-inline-end: 10px;

引数なし

引数はありません

戻り値なし

戻り値はありません