HTML page with a standard header footer layout without using table tag

Question

How can I attain whats shown in the image without using tables? I want the layout

Answer 1

css :

#header
{
 position:fixed;
 top:0px;
 left:0px;
 right:0px;
 height:20%;
 overflow:hidden;
}
#leftSide
{
 position:fixed;
 top:21%;
 left:0px;
 width:20%;
 bottom:21%;
}
#rightSide
{
 position:fixed;
 top:21%;
 right:0px;
 width:20%;
 bottom:21%;
}
#footer
{
 position:fixed;
 height:20%;
 left:0px;
 right:0px;
 bottom:0px;
}
#content
{
 position:fixed;
 top:21%;
 bottom:21%;
 left:21%;
 width:57%;
}
div {display:block; border:1px solid black;}

html :

header
 
left
 
content
 
right
 
footer

in this example I use fixed position, but you can set overflow-x and overflow-y for every of this div's. for example: for content you can use overflow-x:hidden and overflow-y:auto or scroll and so on for every div. of course, page will not be scrollable in this example.