Эквивалентен тегу <center> в CSS?

Я читал, что тег <center> устарел, однако я не могу найти в нем никакого реального эквивалента. text-align работает для текста, но не для других элементов, а автоматические поля работают только в том случае, если вы знаете ширину контейнера (так что не решение, если вы не знаете ширины заранее). Итак, существует ли реальный эквивалент этого тега <center>?

Ответы

Ответ 1

text-align должен работать для других типов элементов. Это работает?

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

Редактировать три года спустя:-D

"margin: auto;" также делает верхнее и нижнее поля "авто". Возможно, это не то, что вы хотите. В качестве альтернативы вы можете иметь что-то вроде:

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

Этот конкретный пример будет центрировать текст горизонтально, а верхний и нижний поля - 3 пикселя.

Можно также сказать что-то вроде "margin: 3px auto 3px auto"; но я предпочитаю четко указывать направления, поскольку я никогда не могу вспомнить, что такое порядок параметров, если я поместил их все в одну настройку "margin:".

Ответ 2

Есть разница

    <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>