CSSの真ん中寄せ「横向き編」

CSS

2024.03.10

１．テキスト・画像の中央揃え：text-align: center;

◆テキスト・画像はインライン要素

◆テキスト・画像の親要素に指定する必要がある。

２．テキスト・画像以外のインライン要素の場合：text-align: center;

◆displayプロパティが「inline」または「inline-block」の場合

◆親要素に指定する必要がある。

↓ボックスは中央寄せ、中のテキストは左寄せの場合：テキスト要素に「display: inline-block;」指定

<html>	<css>
<div class=”contents”> <div class=”text”> テキスト中央寄せ </div> </div>	.contents{ text-align: center; } .text{ display: inline-block; text-align: left; }