如何在css dispay表属性中使用`colspan`？

Question

我正在创建一个css表，因为我需要在将来更改它以进行响应式显示。

我工作车，我无法正确创建colspan。任何人帮助我？在顶部，而不是获得90％和10％，这是没有正确设置。

再次在底部，我需要100％的宽度，但没有正确设置。

＆＃13;

＆＃13;

#table {
    display:table;
    width:100%
}


.row {
    display:table-row;
}

.cell {
    display:table-cell;
    border:1px solid grey;
}

.row1 {
   display: table-caption;
}

.cell1 {
    width:10%
}

.cell2{
    width:70%
}

.cell9{width:90%}
.cell4{width:40%}
.subcell2{width:20%}
.cell10{width:100%}

＆＃13;

<div id="table">
    <div class="row">
        <div class="cell cell1">30%</div>
        <div class="cell cell2">
            
            <div class="row row1">
                <div class="cell cell9"><h2>90%</h2></div>
                 <div class="cell cell1"><h2>10%</h2></div>
            </div>
            <div class="row">
                <div class="cell cell4"><h2>40%</h2></div>
                <div class="cell subcell2"><h2>20%</h2></div>
                <div class="cell subcell2"><h2>20%</h2></div>
                <div class="cell subcell2"><h2>20%</h2></div>
            </div>
            <div class="row">
                <div class="cell cell10"><h2>100%</h2></div>
            </div>
            
        </div>
    </div>
</div>

＆＃13;

＆＃13;

＆＃13;

提前致谢。