CSS行网格项的宽度与高度相同

Question

我有一个CSS列网格。 （图标div是具有动态/自动高度的div的子代）

网格项必须为正方形。 有很多示例可以如何以连续/水平方式实现 对于垂直栏，它不起作用（我无法使其正常工作）

.icons {
  height: 100%;
  display: grid;
  grid-template-rows: 1fr 1fr;
  grid-gap: 25px;
}

.icon-wrapper {
  background-color: tomato;
  height: 100%;
  // width: 0;
  // padding-right: 100%;
}

<div class="icons">
  <div class="icon-wrapper">
    <div class="icon">icon 1</div>
  </div>
  <div class="icon-wrapper">
    <div class="icon">123</div>
  </div>
</div>

有人可以帮我吗？