谷歌浏览器中的网格溢出 [重复]。

Question

这个问题在这里已经有了答案:

为什么在CSS网格中，网格间隙的百分比值会产生溢出？ (1个回答)

封闭 22天前.

我正在使用grid做一个项目列表（卡片），子网格溢出到下一个元素元素。现在，在Firefox中，我没有这个问题。这里是grid parent和subgrid的代码。

  .grid-parent{
     display: grid;
        margin-top: 2rem;
        grid-template-columns: 26rem [main-start]repeat(5, 1fr[main-end]);
        grid-template-rows: min-content 1fr min-content max-content;
    }

    grid-child{
      grid-column: 2/-1;
            grid-row: 1/-1;
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(min-content, 30rem));
            grid-template-rows: repeat(auto-fit, 1fr);
            justify-content: center;
            align-items: start;
            padding: 0 3%;
            grid-gap: 2%;
        }

    .big-btn{
       grid-column: 1/-1;
        width: 40%;
        padding: 1rem 0;
        font-size: 2.6rem;
        @extend .fw-700;
}

Answer 1

试着在big-btn上加一个margin-bottom？