Question

我正在写这段代码：

<!DOCTYPE html>
<html>
<head>
    <style>
        #gridcontainer {
            display: grid;
            grid-template-columns: 150px 150px;
            grid-template-rows: 150px 150px;
        }
    </style>
</head>
<body>
    <div id="gridcontainer">
        <div>1</div>
        <div>2</div>
        <div>3</div>
        <div>4</div>
    </div>
<body>
</html>

我想要得到类似的东西： 1 2

3 4

但我得到的是： 1 2 3 4

就像完全忽略display:grid一样。我做错了什么？

Answer 1

您使用的浏览器是什么？它是最新的吗？对新CSS Grid规范的支持是有限的，即使在最近的Chrome中也需要标记激活。

请查看Caniuse

中的浏览器支持

网格布局不起作用

1 个答案: