ทำโครงมาให้ รายละเอียดท่านจัดต่อได้เลย
จริงๆ ตามที่ท่าน chlorophill แนะนำเลยครับ แล้วชีวิตจะง่ายขึ้นเยอะ

<!DOCTYPE HTML>
<html lang="en-US">
<head>
<meta charset="utf-8" />
<meta name="keywords" content="" />
<meta name="description" content="" />
<title></title>
</head>
<style>
.containner { width:978px;height:500px;}
header { height:100px; width:100%; background:#888; }
content { width:600px; height:100%; background:#CCC; float:left; }
sidebar { width:340px; height:100%; background:#AAA; float:right; }
footer { height:50px; width:100%; background:#888; float:left; }
</style>
<body class="containner">
<header>
<p>Header</p>
</header>
<content>
<p>Display Content</p>
</content>
<sidebar>
<p>Sidebar Start Here</p>
</sidebar>
<footer>
<p>Copyright © Your name</p>
</footer>
</body>
</html>
แนะนำให้ศึกษา Framework ครับ
Bootstrap หรือ Foundation สองตัวนี้เป็นที่นิยม
แล้วการกำหนด layout จะง่ายกว่าเดิมเยอะมาก
มันคือ

คือ HTML framework ครับ มีของคนไทยด้วยชื่อ ใจดี เฟรมเวอร์ค
Jaidee HTML Framework เป็นชุดคำสั่ง CSS และ JS ที่ได้รับการรวบรวมมาเพื่อตอบสนองการสร้างเว็บไซต์แบบ Responsive webdesign ซึ่งกำลังเป็นที่นิยมในปัจจุบัน
Jaidee HTML Framework จัดเป็น HTML Framework ตัวแรกของไทย ซึ่งมีคุณสมบัติทัดเทียมกับ HTML Framework ของต่างชาติ
คุณสมบัติโดยคร่าวๆ
เขียนด้วย HTML5 และ CSS3
เป็นระบบที่สามารถปรับขนาดตัวเองให้เหมาะสมกับหน้าจอในแต่ละอุปกรณ์
มี Jquery plugin ยอดนิยมใช้ เช่น Slideshow, Tab, Modal
มีระบบนำทาง (Site Navigator) ที่ปรับขนาดตัวเองให้รองรับทุกอุปกรณ์
Jaidee HTML Framework มีขนาดเล็กกว่า HTML Framework ตัวอื่นๆ
Free 100 % & Opensource
เยี่ยมชมหน้าโครงการได้ที่
http://develop.karmins.com/jaidee/ 
ที่มา:
http://www.blognone.com/node/42710 