Question

由于

，观察到的firefox（左）和chrome（右）之间存在差异

我做错了什么/不完整？
浏览器差异/问题？

注意：如果内部网格被注释掉，则两个浏览器都是一致的。

＆＃13;

<!DOCTYPE html>
<html>
<head>
<style>
* {
	box-sizing: border-box;
	margin: 0px;
	padding: 0px;
	border: 0px;
	background: transparent;
}
</style>
</head>
<body style='border: 10px solid steelblue;' scroll='auto'>
  <div style='display: grid; grid-template-columns: 1fr; grid-template-rows: auto; border: 10px solid orange;'>
    <!-- remove the following line to get consitent behavior -->
    <div style='display: grid; grid-template-columns: 1fr; grid-template-rows: auto; border: 10px solid red;'>
      <div style="overflow: auto;">
        <div style='width: 2000px; border: 10px solid green;'>Content</div>
      </div>
    <!-- remove the following line to get consitent behavior -->
    </div>
  </div>
</body>
</html>

＆＃13;

无法使用嵌套的CSS网格实现一致的溢出滚动

0 个答案: