Я рефакторинг старого сайта, и этот лабиринт заполнен таблицами. Мы переходим к HTML5, и мне нужно исправить таблицу, полную
<td align="center">
код. Я нашел частичное решение, создав класс
.centered {
text-align: center;
}
и присвоить его каждому TD, содержащему текст.
Но это не работает с изображениями и некоторыми другими элементами.
margin: auto;
тоже не будет работать.
Какой самый быстрый способ сосредоточить ВСЕ содержимое внутри TD?
Если они являются элементами уровня блока, на них не будет влиять text-align: center;. Кто-то, возможно, установил img { display: block; } и выбросил его из-под удара. Вы можете попробовать:
td { text-align: center; }
td * { display: inline; }
и если он выглядит как желательно, вы должны определенно заменить * на нужные элементы, например:
td img, td foo { display: inline; }
Вы можете использовать встроенный css: <td style = "text-align: center;">
В соответствии с HTML5 CR, который требует постоянной поддержки "устаревших" функций, атрибут align=center довольно сложный. Правила рендеринга таблиц говорят: td элементы с этим атрибутом ", как ожидается, будут центрировать текст внутри себя, как если бы у них было свойство 'text-align' центр" в презентационном намеке и выровнять потомков к центру."
И выравнивание потомков определяется так, чтобы браузер "выровнял только тех потомков, которые имеют как свои свойства" margin-left ", так и" margin-right "для значений, отличных от" auto ", которые являются чрезмерно ограниченными и которые имеют одно из этих двух полей с используемым значением, вынужденным к большему значению, и которые сами не имеют применимого атрибута align. Когда несколько элементов должны выровнять определенный потомок, наиболее глубоко вложенный такой элемент, как ожидается, переопределяет другие. Ожидается, что выровненные элементы будут выровнены, если соответствующие значения их левого и правого полей будут установлены соответствующим образом.
Так что это действительно зависит от содержимого.
вы можете использовать этот код в качестве замены для выравнивания таблицы
table
{
margin:auto;
}