我的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
为什么浏览器不解析它并说
Invalid value
?
我尝试过的浏览器: Chrome、Firefox
仔细观察,第一行包含两次
b0
。
太糟糕了,验证器没有捕捉到这一点!