Okay so I have a DIV with ID "comment" and another DIV with ID "post". Both comment and post are inside another div named "content".
Content is relatively positioned while comment and post are absolutely positioned, I can position post easily but I can't position comment. The problem is comment's static position for some reason is at the very top of "content" not below the post div.
and another problem is I can't place the footer properly.
To be clear, here's the code : <http://jsfiddle.net/BWr93/>

The CSS:

```
   #header {
    width:100%;
    height:80px;
    background:#444;
    position:absolute;
    top:0%;
    left:0%;
    right:0%;
}
#logo {
    width:280px;
    height:200px;
    background:url(Logo.png);
    background-repeat:no-repeat;
    position:absolute;
    left:2%;
    top:-50px;
}
.button {
    width: 130px;
    height: 80px;
    position: absolute;
    top: 0%;
    font-family:Poiret One;
    line-height:80px;
    font-size:24px;
    color:#fff;
    -webkit-transition: all 150ms ease-in-out   ;
    -moz-transition: all 150ms ease-in-out;
    -ms-transition: all 150ms ease-in-out;
    -o-transition: all 150ms ease-in-out;
    transition: all 150ms ease-in-out;
}
.button:hover {
    -webkit-transition:all 200ms ease-in-out
    ;-moz-transition:all 200ms ease-in-out;
    -ms-transition:all 200ms ease-in-out;
    -o-transition:all 200ms ease-in-out;
    transition:all 200ms ease-in-out;
    cursor:pointer;
    background: #333;
}
#container {
    top:80px;
    position:relative;
    width:100%;
    padding-bottom:110px;
    min-height:100%;
}
#post {
    width:80%;
    min-height:300px;
    position:absolute;
    top:6%;
    left:3%;
    font-size:20px;
    font-family:Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
    background-color:#CCC;
    -webkit-box-shadow: 0px 0px 5px 0px rgba(50, 50, 50, 0.75);
    -moz-box-shadow:    0px 0px 5px 0px rgba(50, 50, 50, 0.75);
    box-shadow:         0px 0px 5px 0px rgba(50, 50, 50, 0.75);
}
#post .title {
    width:100%;
    min-height:70px;
    background:#444;
    top:0;
    left:0;
    right:0;
    font-family:Poiret One;
    line-height:70px;
    font-size:34px;
    color:#fff;
    padding-top:5px;
    padding-bottom:5px;
    -webkit-box-shadow: 0px 0px 0px 0px rgba(50, 50, 50, 0);
    -moz-box-shadow:    0px 0px 0px 0px rgba(50, 50, 50, 0);
    box-shadow:         0px 0px 0px 0px rgba(50, 50, 50, 0);

}
#post .title .date {
    width:8%;
    height:60px;
    background-color:#FFF;
    float:left;
}
#comment{
    position:absolute;
    bottom:10%;
    left:3%;
    background:#444;
    width:80%;
    height:50px;
    line-height:50px;
}
#footer {
    position:absolute;
    bottom:0;
    right:0;
    left:0;
    width:100%;
    height:60px;
    background:#444;
    line-height:60px;
    font-family:Poiret One;
    font-size:20px;
    color:#FFF;
       }

```

The HTML:

```
<body>
<!--START HEADER-->
<div id="header">
<div id="logo"></div>
<div class="button" style="left:350px"><center>Home</center></div>
<div class="button" style="left:500px;"><center>For Geeks</center></div>
<div class="button" style="left:650px;"><center>Deep Stuff</center></div>
<div class="button" style="right:50px;"><center>About me</center></div>
</div>
<!--END HEADER-->
<div id="container">

<div id="post">
<div class="title"><div class="date"></div>
<div style="position:relative;left:8px;">
HeyHey Hey Hey Hey Hey Hey Hey Hey Hey Hey HeyHey Hey Hey Hey Hey Hey Hey Hey Hey Hey HeyHey Hey Hey Hey Hey Hey Hey Hey Hey Hey</div>
</div>
<div style="position:relative;left:8px;">
HeyHey Hey Hey Hey Hey Hey Hey Hey Hey HeyHeyHey Hey Hey Hey Hey Hey Hey Hey Hey HeyHeyHey Hey Hey Hey Hey Hey Hey Hey Hey HeyHeyHey Hey Hey Hey Hey Hey Hey Hey Hey HeyHeyHey Hey Hey Hey Hey Hey Hey Hey Hey HeyHeyHey Hey Hey Hey Hey Hey Hey Hey Hey HeyHeyHey Hey Hey Hey Hey Hey Hey Hey Hey HeyHey Hey Hey Hey HeyHeyHey Hey Hey Hey Hey Hey Hey Hey Hey HeyHeyHey Hey Hey Hey Hey Hey Hey Hey Hey HeyHeyHey Hey Hey Hey Hey Hey Hey Hey Hey HeyHey Hey Hey Hey HeyHeyHey Hey Hey Hey Hey Hey Hey Hey Hey HeyHeyHey Hey Hey Hey Hey Hey Hey Hey Hey HeyHeyHey Hey Hey Hey Hey Hey Hey Hey Hey HeyHey Hey Hey Hey HeyHeyHey Hey Hey Hey Hey Hey Hey Hey Hey HeyHeyHey Hey Hey Hey Hey Hey Hey Hey Hey HeyHeyHey Hey Hey Hey Hey Hey Hey Hey Hey HeyHey Hey Hey Hey HeyHeyHey Hey Hey Hey Hey Hey Hey Hey Hey HeyHeyHey Hey Hey Hey Hey Hey Hey Hey Hey HeyHeyHey Hey Hey Hey Hey Hey Hey Hey Hey HeyHey Hey Hey Hey HeyHeyHey Hey Hey Hey Hey Hey Hey Hey Hey HeyHeyHey Hey Hey Hey Hey Hey Hey Hey Hey HeyHeyHey Hey Hey Hey Hey Hey Hey Hey Hey HeyHey Hey Hey Hey HeyHeyHey Hey Hey Hey Hey Hey Hey Hey Hey HeyHeyHey Hey Hey Hey Hey Hey Hey Hey Hey HeyHeyHey Hey Hey Hey Hey Hey Hey Hey Hey HeyHey Hey Hey Hey HeyHeyHey Hey Hey Hey Hey Hey Hey Hey Hey HeyHeyHey Hey Hey Hey Hey Hey Hey Hey Hey HeyHeyHey Hey Hey Hey Hey Hey Hey Hey Hey HeyHey Hey Hey Hey HeyHeyHey Hey Hey Hey Hey Hey Hey Hey Hey HeyHeyHey Hey Hey Hey Hey Hey Hey Hey Hey HeyHeyHey Hey Hey Hey Hey Hey Hey Hey Hey HeyHey Hey Hey Hey HeyHeyHey Hey Hey Hey Hey Hey Hey Hey Hey HeyHeyHey Hey Hey Hey Hey Hey Hey Hey Hey HeyHeyHey Hey Hey Hey Hey Hey Hey Hey Hey HeyHey Hey Hey Hey HeyHeyHey Hey Hey Hey Hey Hey Hey Hey Hey 
</div>
</div>
<div id="comment">Comments</div>
<!--FOOTER-->
<div id="footer"><center>All rights reserved Maroworld.com&reg;</center></div>
<!--END FOOTER-->
</div>
</body>

```

You will understand everything when you see it, I just want the footer at the bottom no matter how the page content extend and the comment div below the post div.

Thanks in advance.