Create 3 columns layout and group 2 div elements in the third column - HTML CSS CSS Layout

HTML CSS examples for CSS Layout:3 Column

  1. HOME
  2. HTML CSS
  3. CSS Layout
  4. 3 Column

Description

Create 3 columns layout and group 2 div elements in the third column

Demo Code

ResultView the demo in separate window 

<!doctype html>
<html>
 <head> 
  <style type="text/css">

div {<!--from w  w  w .j  a  v  a2 s .c o m-->
   width: 32%;
   margin: 0 1% 0;
   padding: 0;
}


      </style> 
 </head> 
 <body> 
  <div class="views-field-field-content-value" style="background-color: #000; height: 300px; float: right;"></div> 
  <div class="views-field-title" style="background-color: #333; height: 100px; float: left;"></div> 
  <div class="views-field-field-image-fid" style="background-color: #666; height: 400px; position: absolute; top: 0; left: 33%;"></div> 
  <div class="views-field-field-date-value" style="background-color: #ccc; height: 100px; float:left; clear: left;"></div> 
  <div class="views-field-field-pdf-fid" style="background-color: #999; height: 100px; float: right; clear: right;"></div>  
 </body>
</html>

Related Tutorials