Question

我最近发现谷歌浏览器中的内容长度超过16777216像素时未呈现。

完整的HTML：

<html>
<head>
<style>
#content {
    height: 16777316px;
    position: relative;
    font-size: 2em;
    font-weight: 700;
}
#semi-hidden {
    position: absolute;
    bottom: 0;
    background-color: #000000;
    color: #ffffff;
    height: 200px;
    width: 50%;
    float: left;
}
#hidden {
    position: absolute;
    bottom: 0;
    background-color: #ffffff;
    color: #000000;
    height: 100px;
    width: 50%;
    float: right;
}
</style>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
</head>

<body>
<div id="content">Scroll Down &darr;
  <div id="semi-hidden"> The Bottom 100px of this DIV is not rendered. </div>
  <div id="hidden"> This DIV is completly hidden. </div>
</div>
</body>
</html>

编辑：这是因为Google Chrome不支持大于16777216像素的布局。

Answer 1

Google Chrome使用LayoutUnits表示布局元素位置，它可以代表已签名int的空间的1/64（2 ^ 31/64整数值，或+/- 16777216）。

Google Chrome无意在不久的将来支持更大的价值。

Bug Report

Google Chrome中大于16777216像素的内容未呈现

1 个答案: