テーブルタグを使わない場合(絶対位置で)

css中でleftやtopで位置決めをし、大きさはwidthやheightで指定。
absoluteは絶対位置指定です。
toptitle
menu
aaaa
bbbb
cccc
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>boxstyle</title>
<link rel="stylesheet" href="sample.css">
</head>
<body>
<div id="topdata">toptitle</div>
<div id="leftsdata">menu</div>
<div id="middlesdata">aaaa</div>
<div id="rightsdata">bbbb</div>
<div id="bottomsdata">cccc</div>
</body>
</html>
@charset "UTF-8";
 
div{
font-size:1.1em;
}
 
#topdata {
width: 200px;
height: 50px;
color: #000000;
background: #F0FFF0;
left: 103px;
top: 0px;
position: absolute;
 
display: block;
border-style: double;
border-top: double #000000 medium;border-bottom: double #000000 medium;
overflow: scroll;
}
 
#leftsdata {
width: 100px;
height:200px;
color: #000000;
background: #F0FFF0;
left: 0px;
top: 0px;
position: absolute;
 
display: block;
border-style: double;
border-top: double #000000 medium;border-bottom: double #000000 medium;
overflow: scroll;
}
 
#middlesdata {
width: 100px;
height:150px;
color: #000000;
background: #F0FFF0;
left: 103px;
top: 53px;
position: absolute;
display: block;
border-style: double;
border-top: double #000000 medium;border-bottom: double #000000 medium;
overflow: scroll;
}
 
#rightsdata {
width: 100px;
height:150px;
color: #000000;
background: #F0FFF0;
left: 203px;
top: 53px;
position: absolute;
display: block;
border-style: double;
border-top: double #000000 medium;border-bottom: double #000000 medium;
overflow: scroll;
}
 
#bottomsdata {
width: 303px;
height:100px;
color: #000000;
background: #F0FFF0;
left: 0px;
top: 203px;
position: absolute;
display: block;
border-style: double;
border-top: double #000000 medium;border-bottom: double #000000 medium;
overflow: scroll;
}
inserted by FC2 system