3 columns, all fluid

3 columns, all fluid : three Columns : Layout Attributes HTML CSS TUTORIALS


 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "DTD/xhtml1-transitional.dtd">
<html><head><title></title>
<style type="text/css">
  #mainright {
    width:33%;
    float:left;
    background:#aaa;
    padding-bottom:10px;
  }
  
  #maincenter {
    width:34%;
    float:left;
    background:#bbb;
    padding-bottom:10px;
  }
  
  #mainleft {
    width:33%;
    float:left;
    background:#ccc;
    padding-bottom:10px;
  }
  
  #banner {
    background:#ddd;
  }
  
</style>
</head><body>
<div id="banner"><h1>3 columns, all fluid</h1></div>

<div id="mainleft">
  <h1>mainleft</h1>
  <p>this is a test. this is a test. this is a test. this is a test. 
  this is a test. this is a test. this is a test. this is a test. 
  this is a test. this is a test. this is a test. this is a test. 
  this is a test. this is a test. this is a test. this is a test. 
  this is a test. this is a test. this is a test. this is a test. 
  this is a test. this is a test. this is a test. this is a test. 
  this is a test. this is a test. this is a test. this is a test. 
  </p>
</div>

<div id="maincenter">
  <h1>maincenter</h1>
  <p>this is a test. this is a test. this is a test. this is a test. 
  this is a test. this is a test. this is a test. this is a test. 
  this is a test. this is a test. this is a test. this is a test. 
  this is a test. this is a test. this is a test. this is a test. 
  this is a test. this is a test. this is a test. this is a test. 
  this is a test. this is a test. this is a test. this is a test. </p>
</div>

<div id="mainright">
  <h1>mainright</h1>
  <p>this is a test. this is a test. this is a test. this is a test. 
  this is a test. this is a test. this is a test. this is a test. 
  this is a test. this is a test. this is a test. this is a test. 
  this is a test. this is a test. this is a test. this is a test. 
  this is a test. this is a test. this is a test. this is a test. 
  </p>
  
</div>

</body>
</html>

HTML code for linking to this page:

3 columns, all fluid : three Columns : Layout Attributes HTML CSS TUTORIALS

HTML CSS TUTORIALS » Layout Attributes » three Columns »

HTML CSS TUTORIALS