Html 我有一个网格布局，想合并两列

所以我对列使用div，可以说我想合并两个“单元格”。我在下面有一个布局，我想把下面的两个div合并成一个div

我无法发布图像，因此这里有我想要的链接：

以下是我的html代码：

<div class="grid">
    <div class="column">
        <div class="width1 height1 grid_item"></div>
        <div class="width1 height2 grid_item"></div>
        <div class="width1 height1 grid_item"></div>
    </div>
    <div class="column">
        <div class="width1 height2 grid_item"></div>
        <div class="width1 height1 grid_item"></div>
        <div class="width1 height1 grid_item"></div>
    </div>
    <div class="column">
        <div class="width2 height1 grid_item"></div>
        <div class="width2 height2 grid_item"></div>
        <div class="width2 height1 grid_item"></div>
    </div>
    <div class="column">
        <div class="width2 height1 grid_item"></div>
        <div class="width2 height1 grid_item"></div>
        <div class="width2 height1 grid_item"></div>
        <div class="width2 height1 grid_item" style="text-align:right">merge --&gt;</div>
    </div>
    <div class="column">
        <div class="width1 height3 grid_item"></div>
        <div class="width1 height1 grid_item"> &lt;--merge</div>
    </div>  
</div>  

---

表的布局很糟糕，但它们不是我们应该在HTML中扔掉而永远不用的东西。表格非常适合于表格数据。如果你想制作一个数据网格（看起来就是这样），使用一个表。这就是为什么我把它作为一个div，也许这里的单词merge不是正确的，但它是同一个概念解决了它，如果有人需要相同问题的帮助，让我知道嗨，我面临着类似的情况。你能分享一下你是如何解决这个问题的吗？我创建了一个div，它综合了右边的两列，然后有两个div，一个放在底部，另一个放在顶部。你可以看看下面的网站；我不再使用它了，但它应该会有所帮助。检查源代码：

.height1{
height:160px;

}
.height2{
height:320px;   
}
.height3{
height:484px;   
}
.width1{
width:174px;
}
.width2{
width:213px;
}
.width3{
width:391px;
position:relative;
float:inherit;  
}
.grid_item{
margin:2px;
background-color:green;
}
.column{
position:relative;
float: left;    
}