在css网格布局中得到了一些不需要的空格

Question

玩display: grid并获得一些不必要的空间。我错过了我的CSS中的一些规格吗？

我所追求的是垂直对齐紫色平面底部的5个链接。

以下是我使用的代码：

＆＃13;

＆＃13;

.grid {
  display: grid;
}

.-twoColumns {
  grid-template-columns: repeat(2, 50%);
}

.-grid-gap {
  grid-gap: 1rem;
}

＆＃13;

<div class="grid -twoColumns -grid-gap">
  <div class="column">
    column
  </div>

  <div class="column">
    column
  </div>
</div>

＆＃13;

＆＃13;

＆＃13;