浏览器报告“grid-template-areas”的值无效,但验证器说它是正确的

问题描述 投票:0回答:1

我的CSS如下:

display: grid;
grid-template-areas: "a0 b0 c0 d0 e0 f0 b0" "g1 g1 g1 g1 g1 . ." "i2 i2 i2 i2 . . ." "j3 j3 j3 . k3 k3 k3" "l4 l4 m4 m4 . . ." "a5 b5 c5 n5 n5 o5 o5" ". . . d6 e6 f6 .";

让我布置一下网格,以便更容易查看:

"a0 b0 c0 d0 e0 f0 b0"
"g1 g1 g1 g1 g1 . ."
"i2 i2 i2 i2 . . ."
"j3 j3 j3 . k3 k3 k3"
"l4 l4 m4 m4 . . ."
"a5 b5 c5 n5 n5 o5 o5"
". . . d6 e6 f6 ."

我使用了这个网格验证器,它报告它是有效的:https://github.com/evrom/grid-validator

  • 有7行
  • 是长方形
  • 每行有 7 列
  • 所有区域都是连续且矩形的

为什么浏览器不解析它并说

Invalid value

我尝试过的浏览器: Chrome、Firefox

css css-grid
1个回答
0
投票

仔细观察,第一行包含两次

b0

太糟糕了,验证器没有捕捉到这一点!

© www.soinside.com 2019 - 2024. All rights reserved.