在Chrome中不会显示超过999行 [英] Won't Display More Than 999 Rows in Chrome
问题描述
由于某种原因，在Chrome中，一旦打印了999行，元素就会开始相互重叠.它在Firefox中工作正常.我正在使用的Chrome版本是 70.0.3538.102(正式版本)(64位)，该版本今天早些时候才发布.
For some reason, in Chrome, elements begin overlapping one another once 999 rows have been printed. It works fine in Firefox. The version of Chrome that I'm using is 70.0.3538.102 (Official Build) (64-bit), which was just released earlier today.
这些页面是按字母顺序排序的，在其他任何页面上我都不会遇到此问题，因为"A"页面是唯一具有999行以上的页面.
The pages are sorted alphabetically, and I don't experience this issue on any other page because the 'A' page is the only page with more than 999 rows.
#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的错误还是?
Is this a Chrome bug or?
推荐答案
CSS网格规范为处理超大网格做出了明确规定:
The CSS Grid specification makes explicit provisions for the handling of very large grids:
由于内存有限，UA可能会将网格的可能大小限制在UA定义的限制内，从而将所有行都丢弃到该限制之外.如果将网格项放置在此限制范围之外，则必须将其网格区域限制在此有限网格之内.
Since memory is limited, UAs may clamp the possible size of the grid to be within a UA-defined limit, dropping all lines outside that limit. If a grid item is placed outside this limit, its grid area must be clamped to within this limited grid.
( https://www.w3.org/TR/css-grid-1/#overlarge-grids )
规范继续给出一个示例，该示例涉及一个假设的UA，其网格大小限制为1000，这表明这是一个典型的限制.
The specification goes on to give an example involving a hypothetical UA with a grid size limit of 1000, implying that this is a typical limit.
这不是CSS网格功能的适当应用程序.使用HTML表格-这正是它们的用途.
This is not an appropriate application for CSS Grid functionality. Use an HTML table -- this is exactly the sort of thing they're made for.
这篇关于在Chrome中不会显示超过999行的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
