Не будет отображать более 999 строк в Chrome - PullRequest
0 голосов
/ 10 ноября 2018

По какой-то причине в Chrome элементы начинают перекрывать друг друга после печати 999 строк. Он отлично работает в Firefox. Используемая версия Chrome - 70.0.3538.102 (Official Build) (64-bit), выпущенная ранее сегодня.

Страницы отсортированы в алфавитном порядке, и я не вижу этой проблемы ни на какой другой странице, потому что страница «A» является единственной страницей с более чем 999 строками.

enter image description here

#data {
  display: grid;
  grid-template-columns: repeat(8, max-content);
  grid-template-rows: auto;
}

<section id="data">
   ...
  <div>1000</div><div>axelle</div><div>G</div><div>92,296</div><div>2018-11-09</div><div>NULL</div><div>0</div><div>2018-11-09 07:49:36</div><div>1001</div><div>axes</div><div>G</div><div>88,536</div><div>2018-11-09</div><div>NULL</div><div>0</div><div>2018-11-09 07:49:36</div><div>1002</div><div>axethrowing</div><div>G</div><div>138,823</div><div>2018-11-09</div><div>NULL</div><div>0</div><div>2018-11-09 07:49:36</div><div>1003</div><div>axial</div><div>G</div><div>395,943</div><div>2018-11-09</div><div>NULL</div><div>0</div><div>2018-11-09 07:49:36</div><div>1004</div><div>axialracing</div><div>G</div><div>165,508</div><div>2018-11-09</div><div>NULL</div><div>0</div><div>2018-11-09 07:49:36</div><div>1005</div><div>axilas</div><div>G</div><div>87,736</div><div>2018-11-09</div><div>NULL</div><div>0</div><div>2018-11-09 07:49:36</div><div>1006</div><div>axiom</div><div>G</div><div>110,834</div><div>2018-11-09</div><div>NULL</div><div>0</div><div>2018-11-09 07:49:36</div><div>1007</div><div>axioo</div><div>G</div><div>321,874</div><div>2018-11-09</div><div>NULL</div><div>0</div><div>2018-11-09 07:49:36</div>
   ...
</section>

Это ошибка Chrome или?

1 Ответ

0 голосов
/ 10 ноября 2018

Спецификация CSS Grid содержит явные условия для обработки очень больших сеток:

Так как память ограничена, UA могут ограничить возможный размер сетки, чтобы он находился в пределах, определенных UA, отбрасывая все строки вне этого предела. Если элемент сетки находится вне этого предела, его область сетки должна быть ограничена в пределах этой ограниченной сетки.

(https://www.w3.org/TR/css-grid-1/#overlarge-grids)

В спецификации дается пример, включающий гипотетический UA с пределом размера сетки 1000, что подразумевает, что это типичный предел.

Это неподходящее приложение для функциональности CSS Grid. Используйте таблицу HTML - это именно то, для чего они созданы.

...