�� body ��

Sat, 14 Mar 2009 19:36:07 GMT

��

�� , �� , �� .

�� , �� body �� .

�� , � ��

��, �� .

��.


<body>

  <div id="header">Header</div>

  <div id="middle">

    <div class="content">Content</div>

    <div class="left">Left</div>

    <div class="right">Right</div>

  </div>

  <div id="footer">Footer</div>

</body>

��, �� web-�� , �� . ��-�� , �� -�� , �� , �� .

�� , �� :)

�� :


* {margin:0;padding:0;}

html,body {height:100%;}

body {

  background-color:#eee;

  margin:0 auto;

  min-width:910px;

  max-width:960px;

}

*html body {

  width:expression(

  document.documentElement.clientWidth < 910 ? '910px':

  (document.documentElement.clientWidth > 960 ? '960px':'auto'));

  zoom:1;

}

*html #middle {overflow-y:visible;height:100%;}

#middle,.content,.left,.right {overflow:hidden;}

#middle {

   border:#00f solid;border-width:0 1px;

   margin-top:-202px; /* height header+footer */

   padding:0 200px;

   min-height:100%;

}

.content,.left,.right {

   float:left;

   margin-top:202px; /* height header+footer */

   margin-bottom:-32767px;

   padding-bottom:32767px;

}

.content {background-color:#fff;margin-right:-100%;width:100%;}

.left {background:#ee9;margin-left:-200px;width:200px;}

.right {

   background:#9dd;

   float:right;

   margin-right:-200px;

   width:200px;

}

*html .right {margin-right:-100px;}

#header {

   background-color:#cce;

   border-top:#00f 1px solid;

   height:100px;

}

#footer {

   background-color:#e9e;

   border:#00f solid;

   border-width:0 1px 1px;

   clear:both;

   height:100px;

}

�� .

�� header � footer, �� footer �� , �� .

�� .

�� middle �� header � footer, �� ��. �� .

�� , �� :) header-� � �� , �� , �� , ��, �� ��.

�� border-��, �� header, middle � footer, � �� , �� , � �� .

�� .

�� , �� , �� , �� , �� (�� 1) � �� .

Trifler Blog

����� body ��� � ������� ������

�� body ��