即使内部有更长的元素，网格列的大小也相同

Question

我有3列的网格布局。即使内部有较大的元素，如何使最后两列的长度相同。

.container {
  display: grid;
  grid-template-columns: 200px repeat(2, 1fr);
}

.a {
  grid-column: 1;
  background: red;
}

.b {
  grid-column: 2;
  background: green;
}

.b div {
  height: 20px;
  width: 950px;
  background: magenta;
}

.c {
  grid-column: 3;
  background: blue;
}

<div class="container">
  <div class="a">a</div>
  <div class="b">b
    <div></div>
  </div>
  <div class="c">c</div>
</div>

CodePen

如果内部有较大的元素，则第二列将扩展其大小。 我尝试自动填充或自动调整，但没有任何效果。