使用IE11 CSS网格时防止重叠

的方法是使用grid-template-rows和grid-template-columns属性来定义网格的行和列。通过设置合适的行高和列宽，可以避免网格重叠。

具体步骤如下：

1. 首先，在父容器中使用display: grid来创建一个网格布局。
2. 使用grid-template-rows属性来定义网格的行高。可以使用具体的像素值或百分比来设置行高，也可以使用auto来自动调整行高。
3. 使用grid-template-columns属性来定义网格的列宽。同样可以使用像素值、百分比或auto来设置列宽。
4. 在子元素中使用grid-row和grid-column属性来指定子元素在网格中的位置。通过设置子元素所占的行数和列数，可以避免重叠。

以下是一个示例代码：

.container {
  display: grid;
  grid-template-rows: 100px 200px; /* 设置两行，第一行高度为100px，第二行高度为200px */
  grid-template-columns: 1fr 2fr; /* 设置两列，第一列宽度为1/3，第二列宽度为2/3 */
}

.item {
  grid-row: 1 / 2; /* 子元素占第一行 */
  grid-column: 1 / 2; /* 子元素占第一列 */
}

在上述示例中，父容器.container使用了网格布局，定义了两行两列的网格。子元素.item通过grid-row和grid-column属性指定了在网格中的位置，使其不会重叠。

推荐的腾讯云相关产品：腾讯云云服务器（CVM）和腾讯云云数据库MySQL。您可以在腾讯云官网了解更多关于这些产品的详细信息和使用方法。

• 腾讯云云服务器（CVM）
• 腾讯云云数据库MySQL