如何使一个网格在其行中具有相同的垂直空间与子div与Tailwind
问题代码：

<script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.6.3/umd/react.production.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.6.3/umd/react-dom.production.min.js"></script>
<script src="https://cdn.tailwindcss.com"></script>

<main class="flex h-fit h-screen">
  <div class="text-primaryTextColor bg-primaryMainBg ml-2 mr-4 h-full w-full rounded-2xl p-3">
    <ul class="grid grid-cols-7 gap-3 pb-1">
      <li class="select-none list-none text-center text-xs font-semibold text-gray-500">LUN</li>
      <li class="select-none list-none text-center text-xs font-semibold text-gray-500">MAR</li>
      <li class="select-none list-none text-center text-xs font-semibold text-gray-500">MIÉ</li>
      <li class="select-none list-none text-center text-xs font-semibold text-gray-500">JUE</li>
      <li class="select-none list-none text-center text-xs font-semibold text-gray-500">VIE</li>
      <li class="select-none list-none text-center text-xs font-semibold text-gray-500">SÁB</li>
      <li class="select-none list-none text-center text-xs font-semibold text-gray-500">DOM</li>
    </ul>
    <ul class="grid h-full grid-cols-7 gap-3 pb-6">
      <a class="active:bg-primaryOptionSelected cursor-pointer select-none list-none border bg-gray-50 bg-opacity-50 pt-1 text-center text-xs font-semibold text-gray-500 duration-300 hover:shadow-md hover:shadow-gray-300" href="/crearGasto"
        ><li>
          <div class="mb-2">29</div>
          <div class="shrink-1 m-0.5 flex bg-red-300 pl-2 pr-2">
            <div class="flex grow">G1</div>
            <div class="flex">1000</div>
          </div>
          <div class="shrink-1 m-0.5 flex bg-red-300 pl-2 pr-2">
            <div class="flex grow">G 2</div>
            <div class="flex">2000</div>
          </div>
          <div class="shrink-1 m-0.5 flex bg-red-300 pl-2 pr-2">
            <div class="flex grow">G 3</div>
            <div class="flex">3000</div>
          </div>
          <div class="shrink-1 m-0.5 flex bg-red-300 pl-2 pr-2">
            <div class="flex grow">G 4</div>
            <div class="flex">4000</div>
          </div>
        </li></a
      ><a class="active:bg-primaryOptionSelected cursor-pointer select-none list-none border bg-gray-50 bg-opacity-50 pt-1 text-center text-xs font-semibold text-gray-500 duration-300 hover:shadow-md hover:shadow-gray-300" href="/crearGasto"
        ><li><div class="mb-2">30</div></li></a
      ><a class="active:bg-primaryOptionSelected cursor-pointer select-none list-none border bg-gray-50 bg-opacity-50 pt-1 text-center text-xs font-semibold text-gray-500 duration-300 hover:shadow-md hover:shadow-gray-300" href="/crearGasto"
        ><li><div class="mb-2">31</div></li></a
      ><a class="active:bg-primaryOptionSelected cursor-pointer select-none list-none border bg-gray-50 bg-opacity-50 pt-1 text-center text-xs font-semibold text-gray-500 duration-300 hover:shadow-md hover:shadow-gray-300" href="/crearGasto"
        ><li><div class="mb-2">1</div></li></a
      ><a class="active:bg-primaryOptionSelected cursor-pointer select-none list-none border bg-gray-50 bg-opacity-50 pt-1 text-center text-xs font-semibold text-gray-500 duration-300 hover:shadow-md hover:shadow-gray-300" href="/crearGasto"
        ><li><div class="mb-2">2</div></li></a
      ><a class="active:bg-primaryOptionSelected cursor-pointer select-none list-none border bg-gray-50 bg-opacity-50 pt-1 text-center text-xs font-semibold text-gray-500 duration-300 hover:shadow-md hover:shadow-gray-300" href="/crearGasto"
        ><li><div class="mb-2">3</div></li></a
      ><a class="active:bg-primaryOptionSelected cursor-pointer select-none list-none border bg-gray-50 bg-opacity-50 pt-1 text-center text-xs font-semibold text-gray-500 duration-300 hover:shadow-md hover:shadow-gray-300" href="/crearGasto"
        ><li><div class="mb-2">4</div></li></a
      ><a class="active:bg-primaryOptionSelected cursor-pointer select-none list-none border bg-gray-50 bg-opacity-50 pt-1 text-center text-xs font-semibold text-gray-500 duration-300 hover:shadow-md hover:shadow-gray-300" href="/crearGasto"
        ><li><div class="mb-2">5</div></li></a
      ><a class="active:bg-primaryOptionSelected cursor-pointer select-none list-none border bg-gray-50 bg-opacity-50 pt-1 text-center text-xs font-semibold text-gray-500 duration-300 hover:shadow-md hover:shadow-gray-300" href="/crearGasto"
        ><li><div class="mb-2">6</div></li></a
      ><a class="active:bg-primaryOptionSelected cursor-pointer select-none list-none border bg-gray-50 bg-opacity-50 pt-1 text-center text-xs font-semibold text-gray-500 duration-300 hover:shadow-md hover:shadow-gray-300" href="/crearGasto"
        ><li><div class="mb-2">7</div></li></a
      ><a class="active:bg-primaryOptionSelected cursor-pointer select-none list-none border bg-gray-50 bg-opacity-50 pt-1 text-center text-xs font-semibold text-gray-500 duration-300 hover:shadow-md hover:shadow-gray-300" href="/crearGasto"
        ><li><div class="mb-2">8</div></li></a
      ><a class="active:bg-primaryOptionSelected cursor-pointer select-none list-none border bg-gray-50 bg-opacity-50 pt-1 text-center text-xs font-semibold text-gray-500 duration-300 hover:shadow-md hover:shadow-gray-300" href="/crearGasto"
        ><li><div class="mb-2">9</div></li></a
      ><a class="active:bg-primaryOptionSelected cursor-pointer select-none list-none border bg-gray-50 bg-opacity-50 pt-1 text-center text-xs font-semibold text-gray-500 duration-300 hover:shadow-md hover:shadow-gray-300" href="/crearGasto"
        ><li><div class="mb-2">10</div></li></a
      ><a class="active:bg-primaryOptionSelected cursor-pointer select-none list-none border bg-gray-50 bg-opacity-50 pt-1 text-center text-xs font-semibold text-gray-500 duration-300 hover:shadow-md hover:shadow-gray-300" href="/crearGasto"
        ><li><div class="mb-2">11</div></li></a
      ><a class="active:bg-primaryOptionSelected cursor-pointer select-none list-none border bg-gray-50 bg-opacity-50 pt-1 text-center text-xs font-semibold text-gray-500 duration-300 hover:shadow-md hover:shadow-gray-300" href="/crearGasto"
        ><li><div class="mb-2">12</div></li></a
      ><a class="active:bg-primaryOptionSelected cursor-pointer select-none list-none border bg-gray-50 bg-opacity-50 pt-1 text-center text-xs font-semibold text-gray-500 duration-300 hover:shadow-md hover:shadow-gray-300" href="/crearGasto"
        ><li><div class="mb-2">13</div></li></a
      ><a class="active:bg-primaryOptionSelected cursor-pointer select-none list-none border bg-gray-50 bg-opacity-50 pt-1 text-center text-xs font-semibold text-gray-500 duration-300 hover:shadow-md hover:shadow-gray-300" href="/crearGasto"
        ><li><div class="mb-2">14</div></li></a
      ><a class="active:bg-primaryOptionSelected cursor-pointer select-none list-none border bg-gray-50 bg-opacity-50 pt-1 text-center text-xs font-semibold text-gray-500 duration-300 hover:shadow-md hover:shadow-gray-300" href="/crearGasto"
        ><li><div class="mb-2">15</div></li></a
      ><a class="active:bg-primaryOptionSelected cursor-pointer select-none list-none border bg-gray-50 bg-opacity-50 pt-1 text-center text-xs font-semibold text-gray-500 duration-300 hover:shadow-md hover:shadow-gray-300" href="/crearGasto"
        ><li><div class="mb-2">16</div></li></a
      ><a class="active:bg-primaryOptionSelected cursor-pointer select-none list-none border bg-gray-50 bg-opacity-50 pt-1 text-center text-xs font-semibold text-gray-500 duration-300 hover:shadow-md hover:shadow-gray-300" href="/crearGasto"
        ><li><div class="mb-2">17</div></li></a
      ><a class="active:bg-primaryOptionSelected cursor-pointer select-none list-none border bg-gray-50 bg-opacity-50 pt-1 text-center text-xs font-semibold text-gray-500 duration-300 hover:shadow-md hover:shadow-gray-300" href="/crearGasto"
        ><li><div class="mb-2">18</div></li></a
      ><a class="active:bg-primaryOptionSelected cursor-pointer select-none list-none border bg-gray-50 bg-opacity-50 pt-1 text-center text-xs font-semibold text-gray-500 duration-300 hover:shadow-md hover:shadow-gray-300" href="/crearGasto"
        ><li><div class="mb-2">19</div></li></a
      ><a class="active:bg-primaryOptionSelected cursor-pointer select-none list-none border bg-gray-50 bg-opacity-50 pt-1 text-center text-xs font-semibold text-gray-500 duration-300 hover:shadow-md hover:shadow-gray-300" href="/crearGasto"
        ><li><div class="mb-2">20</div></li></a
      ><a class="active:bg-primaryOptionSelected cursor-pointer select-none list-none border bg-gray-50 bg-opacity-50 pt-1 text-center text-xs font-semibold text-gray-500 duration-300 hover:shadow-md hover:shadow-gray-300" href="/crearGasto"
        ><li><div class="mb-2">21</div></li></a
      ><a class="active:bg-primaryOptionSelected cursor-pointer select-none list-none border bg-gray-50 bg-opacity-50 pt-1 text-center text-xs font-semibold text-gray-500 duration-300 hover:shadow-md hover:shadow-gray-300" href="/crearGasto"
        ><li><div class="mb-2">22</div></li></a
      ><a class="active:bg-primaryOptionSelected cursor-pointer select-none list-none border bg-gray-50 bg-opacity-50 pt-1 text-center text-xs font-semibold text-gray-500 duration-300 hover:shadow-md hover:shadow-gray-300" href="/crearGasto"
        ><li><div class="mb-2">23</div></li></a
      ><a class="active:bg-primaryOptionSelected cursor-pointer select-none list-none border bg-gray-50 bg-opacity-50 pt-1 text-center text-xs font-semibold text-gray-500 duration-300 hover:shadow-md hover:shadow-gray-300" href="/crearGasto"
        ><li><div class="mb-2">24</div></li></a
      ><a class="active:bg-primaryOptionSelected cursor-pointer select-none list-none border bg-gray-50 bg-opacity-50 pt-1 text-center text-xs font-semibold text-gray-500 duration-300 hover:shadow-md hover:shadow-gray-300" href="/crearGasto"
        ><li><div class="mb-2">25</div></li></a
      ><a class="active:bg-primaryOptionSelected cursor-pointer select-none list-none border bg-gray-50 bg-opacity-50 pt-1 text-center text-xs font-semibold text-gray-500 duration-300 hover:shadow-md hover:shadow-gray-300" href="/crearGasto"
        ><li><div class="mb-2">26</div></li></a
      ><a class="active:bg-primaryOptionSelected cursor-pointer select-none list-none border bg-gray-50 bg-opacity-50 pt-1 text-center text-xs font-semibold text-gray-500 duration-300 hover:shadow-md hover:shadow-gray-300" href="/crearGasto"
        ><li><div class="mb-2">27</div></li></a
      ><a class="active:bg-primaryOptionSelected cursor-pointer select-none list-none border bg-gray-50 bg-opacity-50 pt-1 text-center text-xs font-semibold text-gray-500 duration-300 hover:shadow-md hover:shadow-gray-300" href="/crearGasto"
        ><li><div class="mb-2">28</div></li></a
      ><a class="active:bg-primaryOptionSelected cursor-pointer select-none list-none border bg-gray-50 bg-opacity-50 pt-1 text-center text-xs font-semibold text-gray-500 duration-300 hover:shadow-md hover:shadow-gray-300" href="/crearGasto"
        ><li><div class="mb-2">29</div></li></a
      ><a class="active:bg-primaryOptionSelected cursor-pointer select-none list-none border bg-gray-50 bg-opacity-50 pt-1 text-center text-xs font-semibold text-gray-500 duration-300 hover:shadow-md hover:shadow-gray-300" href="/crearGasto"
        ><li><div class="mb-2">30</div></li></a
      ><a class="active:bg-primaryOptionSelected cursor-pointer select-none list-none border bg-gray-50 bg-opacity-50 pt-1 text-center text-xs font-semibold text-gray-500 duration-300 hover:shadow-md hover:shadow-gray-300" href="/crearGasto"
        ><li><div class="mb-2">1</div></li></a
      ><a class="active:bg-primaryOptionSelected cursor-pointer select-none list-none border bg-gray-50 bg-opacity-50 pt-1 text-center text-xs font-semibold text-gray-500 duration-300 hover:shadow-md hover:shadow-gray-300" href="/crearGasto"
        ><li><div class="mb-2">2</div></li></a
      >
    </ul>
  </div>
</main>

我希望网格的第一个单元格的div（G1...G4）不占用父div上的垂直空间，并且网格的所有单元格都采用响应式设计的相同垂直空间。
我想要的最终结果网格是相同的，就像它没有子单元格G1…G4一样，所有单元格都有相同的高度
我该怎么做？谢谢