Избавляемся от тега <center> - PullRequest
       43

Избавляемся от тега <center>

1 голос
/ 27 августа 2011

Я пытаюсь избавиться от тега <center в моем HTML, но, видимо, в некоторых случаях это не так просто.

Этот ответ: HTML: замена для

также не работает для меня.

В следующем примере предполагается центрировать Foo и Bar, но не центрирует Bar.Что здесь не так?

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Title</title>
</head>

<body>

<div style=" margin: 0 auto; text-align:center;">
Foo
<table>
    <tr>
        <td>Bar</td>
    </tr>
</table>

</div>

</body>

</html>

Если я заменим <div> на <center>, тогда все будет работать с отступом, но тег <center> устарел ...

1 Ответ

5 голосов
/ 27 августа 2011

Ваш текущий код центрирует содержащий div, но так как он имеет width: auto (по умолчанию), он расширяется, чтобы заполнить доступное горизонтальное пространство.Это означает, что центрирование помещает его в то же положение, как если бы оно было выровнено влево (или вправо).Если вы хотите центрировать этот элемент, укажите его ширину ... но он не выглядит так, как вы хотите.

Если вы хотите центрировать встроенный контент (например, текст "Foo"), затем примените text-align к контейнеру.

Если вы хотите центрировать содержимое блока (например, эту таблицу), то примените автоматические поля, которые вы используете , к содержимому этого блока (неконтейнер).

См. также Центрирование с использованием CSS

...