CONTOH LAYOUT DENGAN HTML & CSS

<html>
<head>
<title>My Web</title>
<link  rel="stylesheet"  type="text/css"
href="style.css"/>
</head>
<body>
  <div id="site-container">
    <div id="header"><marquee behavior="scroll" bgcolor="#FFFFFF"
>WELCOME TO PALBENO.BLOGSPOT.COM
</marquee><br /><br /></div><!-- End header -->
    <div id="menu-content">
      <div id="menu">
      <h2 class ="judul_1">agus palbeno</h2>
  </div><!-- End menu -->
      <div id="content"></div><!-- End Content -->
    </div><!-- End menu-content -->
    <div id="footer"></div><!-- End Footer -->
  </div><!-- End site container -->
</body>
</html>

@charset "utf-8";
/* CSS Document */

*{
  padding:0px;
  margin:0px;
}

#site-container{
  width:960px;
  height:900px;
  margin:20px auto;
  border:1px solid #000;
  padding-top:5px;
  padding-bottom:5px;
}
#header{
  width:950px;
  height:280px;
  margin:0px auto;
  border:1px solid #000;
}
#menu-content{
  width:950px;
  height:auto;
  margin:5 auto;
}
#menu{
  float:left;
  width:300px;
  height:600px;
  border:1px solid #000;
}

#content{
  float:right;
  width:625px;
  height:600px;
  border:1px solid #000;
}
#footer{
  width:950px;
  height:70px;
  margin:5px auto;
  border:1px solid #000;
}
.floating{
  clear:both;
  height:0px;
  line-height:0px;
}
#header{
  width:950px;
  height:280px;
  background:url(../images/header_1.png);
  margin:5px auto;
}

PNG