HTML のコンテナー内のコンテンツを揃えるために、CSS スタイルの text-align を使用します。これは、コンテンツがテキストの場合、またはブラウザーが IE の場合は正常に機能します。ただし、それ以外の場合は機能しません。
また、名前が示すように、基本的にはテキストを揃えるために使用されます。align プロパティはずっと前に非推奨になりました。
HTML でコンテンツを揃える他の方法はありますか?
ベストアンサー1
text-align はテキストやその他のインライン コンテンツを揃えます。ブロック要素の子は揃えません。
そのためには、配置したい要素に幅を与え、左右の余白を「自動」に設定します。これは、IE5.x を除くすべての環境で機能する標準準拠の方法です。
<div style="width: 50%; margin: 0 auto;">Hello</div>
これをIE6で動作させるには、次の点を確認する必要があります。標準モード適切な DOCTYPE を使用することでオンになります。
IE5/Quirks モードを本当にサポートする必要がある場合 (最近ではそうする必要はほとんどありません)、中央揃えの 2 つの異なるアプローチを組み合わせることができます。
<div style="text-align: center">
<div style="width: 50%; margin: 0 auto; text-align: left">Hello</div>
</div>
(明らかに、スタイルはスタイルシート内に配置するのが最適ですが、インライン バージョンは説明用です。)