Html 创建3列垂直布局？

我正在尝试创建一个三列的垂直布局，水平布局并不难：

现场水平示例：

但在垂直方向上，我尝试了与此相反的代码：

 <div style="width:100%; height :100%;  background-color:Lime;">
    <div style="width:33%; height:100%; background-color:Blue;">
    a
    </div>
    <div style="width:34%; height:100%; background-color:Gray;">
    b
    </div>
    <div style="width:33%; height:100%; background-color:Aqua;">
    c
    </div>        
</div>

A.
B
C

遗憾的是，这不起作用

有什么帮助/建议吗？

<div style="width:100%; height :100%;  background-color:Lime;">
    <div style="width:34%; height:100%; background-color:Blue; float:left;">
        a
    </div>
    <div style="width:33%; height:100%; background-color:Gray; float:left;">
        b
    </div>
    <div style="width:33%; height:100%; background-color:Aqua; float:left;">
        c
    </div>        
</div>

A.
B
C

添加

浮动：左到列？谢谢，这是解决方案！