web-dev-qa-db-ja.com

CSSの<center>タグと同等ですか?

<center>タグが非推奨になっていることを読みましたが、CSSでそれに相当するものを見つけることができません。 text-alignはテキストに対して機能しますが、他の要素に対しては機能しません。自動マージンは、コンテナーの幅がわかっている場合にのみ機能します(したがって、幅が事前にわからない場合は解決策にはなりません)。では、この<center>タグに相当するものはありますか?

13
laurent

text-alignは、他の種類の要素でも機能するはずです。これは機能しますか?

.center { margin: auto; text-align: center; }

3年後に編集:-D

「マージン:自動;」また、上下の余白を「自動」にします。それはあなたが望むものではないかもしれません。または、次のようにすることもできます。

.center { margin-left: auto;
          margin-right: auto;
          margin-top: 3px;
          margin-bottom: 3px;
          text-align: center; }

この特定の例では、上下の余白を3ピクセルに配線しながら、テキストを水平方向に中央揃えにします。

「マージン:3px自動3px自動」のように言うこともできます。ただし、パラメータをすべて1つの「margin:」設定に配置すると、パラメータの順序を完全に思い出せないため、方向を明示的に綴ることを好みます。

21
Mike Crawford

違いがあります

    <center>
      <span> works </span>
    </center>

    <span style="margin: auto; text-align: center;"> And this is broken</span>

    <div style="margin: auto; text-align: center;"> but this works works</div>
8
Isaksen