具有部分透明背景的Div无法使其他div在codeigniter中流入透明部分

Question

我目前正在使用具有png背景的div。 png的一部分是透明的。我试图在背景div中放入三个div，但它们溢出到png div的透明区域。我的框架是codeigniter。

这是我的HTML

<div id="image">
<div id="red">Red</div>
<div id="yellow">Yellow</div>
<div id="green"> Green</div>

这是我的css

#image{
    background:url(../images/body.png);
    overflow: visible;
    width: 226px;
    height: 321px;
    float: right;
    float: top;
    border:5px solid black;

}
#red
{
    border-style: url(../images/body.png);
    height: 100px;
    background-color: red;
    overflow:hidden; 
    width: 100%;

}
#green
{
    height: 100px;
    background-color: green;
    overflow:hidden;

}
#yellow
{
    height: 100px;
    background-color: yellow;
    overflow:hidden;

}

我没有足够的声誉来张贴我想要实现的目标的图片。 谢谢