дисплей: таблица разбивочной ширины / высоты

Question

В последнее время мне нравится использовать CSS-таблицы все больше и больше.

Когда у меня другая проблема с display:table, @vincicat отметил, что макет таблицы будет иметь возможность разбить назначенный CSS width / height.

Я немного поэкспериментировал и натолкнулся на несоответствия браузера: http://jsfiddle.net/fabb/WywqB/

в Chrome

в Opera

Правда ли, что display:table может изменить назначенный CSS width или height?Есть ли какие-либо источники в спецификации W3C, утверждающие, что (я еще ничего не нашел)?

Разве браузеры не должны вести себя так же?Какой из браузеров подходит?

Answer 1

http://www.w3.org/TR/2011/REC-CSS2-20110607/visudet.html упоминает, что вычисления ширины и высоты для таблиц выполняются по-разному, много раз.

В CSS 2.1 эффект 'min-width' и 'max-width'для таблиц, встроенных таблиц, ячеек таблицы, столбцов таблицы и групп столбцов не определено.

Примечание.Значения этого свойства [вертикальное выравнивание] имеют разные значения в контексте таблиц.Пожалуйста, обратитесь к разделу об алгоритмах высоты стола для деталей.

[Ширина] Применяется ко всем элементам, кроме незаменяемых встроенных элементов, строк таблицы и групп строк

и т. Д.

Answer 2

Ширина и высота должны рассматриваться отдельно:

http://www.w3.org/TR/CSS2/tables.html#width-layout

Алгоритмы ширины таблицы [...]

CSS не определяет «оптимальную» компоновку для таблиц, поскольку во многих случаях оптимальным является вопрос вкуса. CSS определяет ограничения, которые должны соблюдать пользовательские агенты при разметке таблицы. Пользовательские агенты могут использовать любой алгоритм, который они хотят сделать, и могут свободно выбирать скорость рендеринга, а не точность, кроме случаев, когда выбран «алгоритм фиксированной разметки».

и

Алгоритмы высоты стола [...]

Высота таблицы задается свойством 'height' для элемента 'table' или 'inline-table'. Значение 'auto' означает, что высота является суммой высот строк плюс любые интервалы или границы ячеек. Любое другое значение рассматривается как минимальная высота. CSS 2.1 не определяет, как распределяется дополнительное пространство, когда свойство 'height' заставляет таблицу быть выше, чем было бы в противном случае.

Таким образом, вы не можете контролировать высоту своих таблиц, но вы можете контролировать их ширину, если назначите table-layout:fixed.

Я почти уверен, что он работает во всех браузерах (учитывая, что IE8 не является браузером ...)