Простой тест браузеров на поддержку web-стандартов

По стандарту HTML 4.01, значение 0 (ноль) атрибута colspan или rowspan ячейки таблицы должно приводить к растягиванию ячейки на всю ширину (для colspan) или высоту (для rowspan) содержащей её секции таблицы (thead, tbody или tfoot) вне зависимости от количества строк или столбцов.

Однако посмотрим, как в действительности ведут себя сегодняшние браузеры (серым цветом помечены ячейки с нулевыми значениями colspan или rowspan):

Как видим, точно следует стандарту лишь Firefox. Opera почему-то действует избирательно, понимая нулевое значение только применительно к rowspan и игнорируя нулевой colspan.

Остальные браузеры и, тем более, не-вполне-браузеры безмятежно отдыхают.

Демонстрационные примеры

При помощи следующих примеров вы можете самостоятельно проверить ваш браузер.

Обновление (2008-05-25): добавлены демо-примеры, актуализированы легенды скриншотов.

---

Комментарии | добавить

Внимание

Эта заметка перенесена из старого блога, где к ней есть комментарии, на данной странице не отражённые.

WFrag 2008-09-04

В FF они всё равно как-то подглючивают. Делал детализацию строки. Тыкаешь на строку, за ней разворачивается tr на всю ширину (как раз с td с colspan="0"). Так вот в FF начинали некоторые бордеры у колонок пропадать.

MT 2008-09-05

Вероятно, для вашей таблицы было задано правило {border-collapse: collapse}, относительно интерпретации которого у разработчиков Firefox чёткого мнения нет.

Для беспроблемного отображения таблиц в Firefox следует либо вынести {border-collapse: collapse} в индиви­дуальную таблицу стилей для IE (наиболее часто это правило применяется для имитации нулевого border-spacing, функционально соответствующего HTML-атрибуту cellspacing и в IE 6/7 не работающего) либо дополнительно переопределить border-collapse в значение separate специально для Firefox:

TABLE {border-collapse: collapse; border-spacing: 0; }
:root TABLE {border-collapse: separate; }

Кроме того, если для таблицы задана ширина (например, 100%), полезно установить её свойства -moz-box-sizing и box-sizing в значение border-box, за счёт чего ширина таблицы в Firefox и других современных браузерах будет включать в себя рамку, которая гарантированно отобразится в пределах отведённой для таблицы области.