css - -ms-grid 子子规则

Question

我有以下html结构：

<div class="parent">
  <div class="child">
    <div class="sub-child-1"></div>
    <div class="sub-child-2"></div>
  </div>
</div>

并遵循 CSS 规则

.parent {
  display: -ms-grid;
  -ms-grid-columns: 150px 1fr 1fr;
}
.child {
  -ms-grid-column-span: 2;
}

如何分配sub-child-1给第一列和sub-child-2第二列？

Answer 1

考虑到这在 IE 中有效（无法测试，我在 linux 上）它应该是：

.sub-child-1 {
    -ms-grid-row: 1;
    -ms-grid-column: 1;
}

.sub-child-2 {
    -ms-grid-row: 1;
    -ms-grid-column: 2;
}

我很确定您必须将 sub-child-1 和 sub-child-2 移动到父级，或者在子级而不是父级上定义一个网格。