<!DOCTYPE html>
<html dir="ltr" lang="tr-TR">
  <head>
    <title>ApiQ Blog</title>
    <link rel="stylesheet" type="text/css" media="all" href="style.css" />
  </head>
  <body>
    <div id="cerceve">
      <div id="ust">Burası üst(header) alanımız.</div>
      <div id="index">Burası içerik(index) alanımız.</div>
      <div id="sidebar">Burası Kenar Çubuğu(sidebar) alanımız.</div>
      <div class="clearfix"></div>
      <div id="alt">Burası alt(footer) alanımız.</div>
    </div>
</html>
/* 
Theme Name: ApiQ Blog
Theme URI: http://www.acaglar.com
Description: WordPress blog teması
Author: Abdurrahman ÇAĞLAR
Author URI: www.acaglar.com Version: 1.0
*/


body { 
  background:#eee; 
  font-family:Arial; 
  font-size:12px; 
  margin: 0; 
  padding: 0;
} 
#cerceve { 
  width:1000px; 
  margin:0 auto; 
  padding: 0; 
} 
#ust { 
  width: 100%; 
  min-height: 80px; 
  background: #c60000; 
} 
#index { 
  width: 70%; 
  min-height: 400px; 
  background: #aaa; 
  float: left;
}
#sidebar {
  width: 30%; 
  min-height: 400px;
  background: #555;
  float:left;
} 
#alt { 
  width:100%;
  min-height: 80px; 
  background: #008080;
  display: block;
  float: none;
} 
.clearfix:after {
  content: "."; 
  display: block; 
  clear: both; 
  visibility: hidden; 
  line-height: 0; 
  height: 0;
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.