У меня есть простая таблица HTML, которую я хочу последовательно отображать во всех современных браузерах (IE9, последняя версия FF, Chrome, Safari) . Если я применю ширину и «display: inline-block» только к ячейкам таблицы, FireFox 4 и Chrome позволят ячейкам таблицы «обернуться» во вторую строку, как если бы они были обычными элементами встроенного блока. В IE9, однако, ячейки обрабатываются как классические ячейки таблицы, не сохраняют свою ширину и сжимаются в одну строку.
Полный пример кода находится здесь: http://jsbin.com/ujeber/6
Есть ли свойство CSS, которое можно применить к элементам table, tr или td для получения IE9, Chrome и FireFox 4 должны вести себя так же, как друг друга? Если нет, то какой из этих браузеров правильно соответствует стандартам или стандарты в данном случае неоднозначны?
Разметка:
Test1
Test2
Test3
Test4
Стиль:
td {
width:300px;
display:inline-block;
}
table {
width: 650px;
}
Я знаю, что это не типичный / предлагаемый способ использования элемент таблицы. Я спрашиваю в контексте ожидаемого поведения движков рендеринга. Я не ищу ответов, связанных с выбором семантически подходящих тегов.