Div Table Thing

<style>
.head
{
    position:absolute;
    left:0px;
    right:0px;
    top:0px;
    height:50px;
    border:1px solid;
}
.body
{
    position:absolute;
    left:0px;
    right:0px;
    top:50px;
    bottom:50px;
    border:1px solid;
    overflow-y:scroll;
    overflow-x:hidden;
}
.cell
{
    position:absolute;
    border:1px solid;
}
.foot
{
    position:absolute;
    left:0px;
    right:0px;
    bottom:0px;
    height:50px;
    border:1px solid;
}
#table
{
    position:absolute;
    left:0px;
    top:0px;
    width:300px;
    height:500px;
    border:1px solid;
}
</style>
<div id="table">
<div class="head"></div>
<div class="body">
<div class="cell" style="width:50%;left:0%;">ABC</div>
<div class="cell" style="width:50%;left:50%;">ABC</div>
</div>
<div class="foot"></div>
</div>
<script>
function Table(style,parent,brother)
{
    this.table = document.createElement("div");
    this.head = document.createElement("div");
    this.body = document.createElement("div");
    this.foot = document.createElement("div");
    this.cols = [];
    table.style.position="absolute";
    for(var i in style)
    {
        table.style[i]=style[i];
    }
    head.className = "head";
    body.className = "body";
    foot.className = "foot";
    table.appendChild(head);
    table.appendChild(body);
    table.appendChild(foot);
    if(brother)parent.insertBefore(table,brother);
    else parent.appendChild(table);
    this.AddRows = function(count)
    {

    }
    this.AddCols = function(count)
    {

    }
}
</script>