CSS + Div Positioning

CSS + Div Positioning

 <!  Doctype HTML public
"-// W3C // dtd xhtml 0 transitional // en"
Http://www.worg/TR/xhtml1/DTD/xhtml1-transitional.dtd"  >  
  <  Html  Xmlns  = "Http://www.worg/1999/xhtml"  >  
  <  Head  >  
 <  Meta  HTTP-equiv  = "Content-Type"  Content  = "Text/html;
Charset = gb2312"     />  
  <  Title  >  Div + CSS example, wayhome's blog  </  Title  > 
  <  Style  Type  = "Text/CSS"  >  
<! --
Body, TD, th  {  Font-family  :  Verdana  ;  Font-size :  9px  ;  }  
-->
  </  Style  > </  Head  >  
  <  Body  >  
 <  Div  Style  = "Position: absolute; top: 5px; Right: 20px; width: 200px;
Height: 180px; Background: #00ff00 ;"  >  
Position: absolute;  <  BR  />  
Top: 5px;  <  BR  />  
Right: 20px;  < BR  />  
  <  Div  Style  = "Position: absolute; left: 20px; bottom: 10px;
Width: 100px; Height: 100px; Background: #00 FFFF ;"  >  
Position: absolute;  <  BR  />  

Left: 20px;  <  BR />  
Bottom: 10px;  <  BR  />  
  </  Div  >  
  </  Div  >  
  <  Div  Style = "Position: absolute; top: 5px; left: 5px; width: 100px;
Height: 100px; Background: #00ff00 ;"  >  
Position: absolute;  <  BR  />  
Top: 5px;  <  BR  />  
Left: 5px;  <  BR  />  
 </  Div  >  
  <  Div  Style  = "Position: relative; left: 150px; width: 300px; Height: 50px;
Background: # ff9933 ;"  >  
Position: relative;  <  BR  />  
Left: 150px;  <  BR />  
  <  BR  />  
Width: 300px; Height: 50px;  <  BR  />  
  </  Div  >  
  <  Div  Style = "Text-align: center; Background: # CCC ;"  >  
  <  Div  Style  = "Margin: 0 auto; width: 600px;
Background: # ff66cc; text-align: Left ;"  >  
  <  P  >  1  </  P  > 
  <  P  >  2  </  P  >  
  <  P  >  3  </  P  >  
  < P  >  4  </  P  >  
  <  P  >  5  </  P  >  
  <  Div  Style = "Padding: 20px 0 0 20px; Background: # FFFF00 ;"  >  
Padding: 20px 0 0 20px;
  <  Div  Style  = "Position: absolute; width: 100px; Height: 100px;
Background: # ff0000 ;"  >  Position:  <  Span  Style  = "Color: # FFF;
"  >  Absolute </  Span  >  ;  </  Div  >  
  <  Div  Style  = "Position: relative; left: 200px; width: 500px;
Height: 300px; Background: # ff9933 ;"  >  
Position:  <  Span Style  = "Color: Blue ;"  >  Relative  </  Span  >  ;  <  BR
  />  
Left: 200px;  <  BR  />  
  < BR  />  
Width: 300px;  <  BR  />  
Height: 300px;  <  BR  />  
  <  Div  Style  = "Position: absolute; top: 20px; Right: 20px;
Width: 100px; Height: 100px; Background: #00 FFFF ;"  > 
Position: absolute;  <  BR  />  
Top: 20px;  <  BR  />  
Right: 20px;  <  BR  /> </  Div  >  
  <  Div Style  = "Position: absolute; bottom: 20px; left: 20px;
Width: 100px; Height: 100px; Background: #00 FFFF ;"  >  
Position: absolute;  <  BR  />  
Bottom: 20px;  <  BR  />  
Left: 20px;  <  BR  /> 
  </  Div  >  
  </  Div  >  
  </  Div  >  
  </  Div  >  
  </ Div  >  
  </  Body  >  
  </  Html  >