PHP while循环在按钮之间创建空间

Question

我正在尝试使用while循环根据outcomeId的数量动态创建按钮，但是当我尝试使用循环创建按钮时，会在按钮之间产生间隙。

<div class="outcomes">
        <?php
        //echo "<button class=\"outcomebtn\">Outcome A</button>";
        //echo "<button class=\"outcomebtn\">Outcome B</button>";
        $arrayLength = count($_SESSION['outcomeId']);
        $i = 0;
        while ($i < $arrayLength)
            $num = $_SESSION['outcomeId'][$i];
            echo "<button class=\"outcomebtn\">Outcome $num</button>";
            $i = $i + 1;
        
        ?>
</div>

当我包含注释的按钮时，任何按钮之间都没有间隙。仅当我注释掉循环中不包含的按钮时，才会发生这种情况。以下是网页（1），其中仅使用来自循环的按钮包含注释的按钮（2）：

编辑：这是我的.css

.outcomes
  display: grid;
  grid-template-columns:  1fr;
  width: 100%;
  height: 200px;

.outcomebtn
  font-size: 20pt;
  color: rgba(10, 99, 231, 0.829);
  text-align: left;
  font-size: 20px;
  height: 65px;
  background-color: transparent;
  border-color: 2px lightgray;