При обновлении Chrome до версии 65 содержимое таблицы перемещается вправо и за пределы заголовков столбцов

Таблицы, которые раньше выглядели так в Chrome:

----------------------------------
| Header A | Header B | Header C |
----------------------------------
| Item 1   |          |          |
----------------------------------
| Item 2   | Stuff 1  |  Stuff 2 |
----------------------------------

... после обновления Chrome до v65 теперь выглядят так:

---------------------------------------------
| Header A | Header B | Header C |          |
---------------------------------------------
| Item 1   | Item 2   | Stuff 1  |  Stuff 2 |
---------------------------------------------

Firefox v59 также отображает таблицу таким образом, поэтому это, вероятно, только внезапно повлияет на тех, у кого есть системы только для Chrome.

Исходный код может выглядеть примерно так:

<table>
 <tr> <th>Header A</th><th>Header B</th><th>Header C</th> </tr>
 <tr> <td rowspan = "0">Item 1</td> </tr>
 <tr> <td rowspan = "1">Item 2</td><td>Stuff 1</td><td>Stuff 2</td></tr>
</table>
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...
Введение в CSS
Введение в CSS
CSS является неотъемлемой частью трех основных составляющих front-end веб-разработки.
Как выровнять Div по центру?
Как выровнять Div по центру?
Чтобы выровнять элемент <div>по горизонтали и вертикали с помощью CSS, можно использовать комбинацию свойств и значений CSS. Вот несколько методов,...
Навигация по приложениям React: Исчерпывающее руководство по React Router
Навигация по приложениям React: Исчерпывающее руководство по React Router
React Router стала незаменимой библиотекой для создания одностраничных приложений с навигацией в React. В этой статье блога мы подробно рассмотрим...
Система управления парковками с использованием HTML, CSS и JavaScript
Система управления парковками с использованием HTML, CSS и JavaScript
Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...
Toor - Ангулярный шаблон для бронирования путешествий
Toor - Ангулярный шаблон для бронирования путешествий
Toor - Travel Booking Angular Template один из лучших Travel & Tour booking template in the world. 30+ валидированных HTML5 страниц, которые помогут...
2
0
63
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

Chrome используется для визуализации строки с атрибутом rowspan = "0" как 0 или 1 высота. Chrome v65 теперь отображает его «правильно», как указано в html spec здесь. Это означает, что запись теперь заполняет первый столбец, выталкивая все последующие записи в следующий столбец и так вправо.

Это может быть вызвано, например, модулями визуализации html, которые вычисляют, сколько строк может занять ячейка в соответствии со списком подэлементов, когда этот список пуст. (Например, это делает struts-layout улучшения-foundation; похоже, он не поддерживался с 2011 года, и попытки зарегистрироваться на сайте пока меня не подводят)

Другие вопросы по теме