我正在为网格使用以下HTML标记。
....
....
....
....
....
....
....
....
SCSS代码如下所示：
.grid {
display: grid;
grid-template-columns: repeat( 4, 1fr );
grid-gap: 30px;
align-items: start;
.grid-item {
&.height-2x {
grid-row: span 2;
}
&.width-2x {
grid-column: span 2;
}
}
}
由于我在工作流程中使用自动前缀，因此会自动添加所有相关属性，并添加
....
....
....
....
....
....
....
....
前缀。 我可以通过检查元素确认。
现在，问题是此代码在Chrome，Firefox和Opera中运行正常，但是当我在Microsoft Edge或IE 11中打开此页面时，所有网格项在第一个单元格处都相互重叠。 根据此站点，这些浏览器支持带有
....
....
....
....
....
....
....
....
前缀的CSS网格布局。 我已经为这种情况创建了一个CodePen。
CodePen链接
为什么不起作用？
....
....
....
....
....
....
....
....
....
....
....
....
....
....
....
....
1279
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
