如何在“列”放置在CSS网格中的多行之后*进行拉伸？

Question

我正在尝试使用网格复制此Flex-Box：

main {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
}

main > article{
    flex:1 1 400px;
}

例如，如果行距为900px，则flex将在每行放置两篇文章（考虑到flex-basis为400px），以后每篇文章将增长到450px。

基本上，我理想的物品宽度是400px，我愿意尽可能地伸展，但又不占用其他弹性物品的空间。

有没有办法用网格做这样的事情？

谢谢。

main {
    display: flex;
    width:90px;
    flex-direction: row;
    flex-wrap: wrap;
    border:2px blue solid;
}

main > article{
    background-color: lightblue;
    flex:1 1 40px;
    border:2px red solid;
    box-sizing:border-box;
}

<main>
  <article>A</article>
  <article>B</article>
  <article>C</article>
  <article>D</article>
  <article>E</article>
</main>