网格-为第2/5行指定的行，但未按预期工作，只填写1行[已关闭]

Question

在下面的示例中，我想将框4拉伸成2-3-4行。我使用了“grid-row：2/5；”选项，但它并不像预期的那样工作，只填写了一行：2/3。

此处代码：

<style>
    .wrapper {
        display: grid;
        grid-template-columns: 1fr 2fr 2fr 1fr;
        grid-gap: 1em;
        grid-auto-rows: minmax(100px, auto);
    }
    .wrapper > div {
        background-color: #ddd;
        padding: 1em;
        border: black 1px solid
    }

    .box1 {
        grid-column: 1/5;
    }
    .box3 {
        grid-column: 2/4;
        grid-row: 2/3
    }
    .box2 {
        grid-row: 2/6;
    };
    .box4 {
        grid-row: 2/5;
        grid-column: 4/5;
    }
    .box7 {
        grid-row: 4/5;
        grid-column: 2/4;
    }
    .box8 {
        grid-row: 5/6;
        grid-column: 2/5;
    }
</style>

和正文：

<div class="wrapper">
    <div class='box1'>1</div>
    <div class='box2'>2</div>
    <div class='box3'>3</div>
    <div class='box4'>4</div>
    <div class='box5'>5</div>
    <div class='box6'>6</div>
    <div class='box7'>7</div>
    <div class='box8'>8</div>

</div>

Answer 1

我发现了问题所在：分号“；”box2块导致问题。