Untitled

Middle div with 100% in CSS? [closed]
<body>
<div id="container">
    <div id="header">
    </div>
    <div id="content">
    </div>
    <div id="footer">
    </div>
</div>
</body>

html, body {
    margin: 0;
    padding: 0;
    border:1px;
    vertical-align:top;
    font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
    font-size:14px;
    color:#333;
    height: 100%;
}
#container {
    height: 100%;
    width: 100%;
}
#header {
    height: 100px;
    width: 100%;
    background: #069;
}
#content {
    height: 100%;
    width: 100%;
    background: #F60;
}
#footer {
    height: 75px;
    width: 100%;
    background: #060;
}

30px
100% (500px)
30px

30px
100% (460px)
30px

* { margin: 0; padding: 0 }
html, body {
    margin: 0;
    padding: 0;
    vertical-align:top;
    font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
    font-size:14px;
    color:#333;
    height: 100%;
    border: 0;
}
#header
{
    height: 100px;
    background:#C60;
}

#container
{
    min-height: 100%;
    height: auto !important; /*Cause footer to stick to bottom in IE 6*/
    height: 100%;
    margin: 0 auto -100px; /*Allow for footer height*/
    vertical-align:bottom;
    background:#096;
}

#footer
{
    height: 100px; /*Push must be same height as Footer */
    background:#C60;
}

<body>
<div id="container">
<div id="header"> </div>
<div id="content"> </div>
</div>
<div id="footer"> </div>
</body>

<body>
    <div id="header">
    </div>
    <div id="content">
    </div>
    <div id="footer">
    </div>
</body>

#header {
    position:absolute;
    top:0px;
    left:0px;
    right:0px;
    height: 100px;
    background: #069;
}
#content {
    position:absolute;
    top: 100px;
    bottom: 75px;
    left:0px;
    right:0px;
    background: #F60;
}
#footer {
    position:absolute;
    bottom: 0px;
    height: 75px;
    left:0px;
    right:0px;
    width: 100%;
    background: #060;
}