<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<meta http-equiv="Content-type" content="text/html; charset=utf-8" />
<style type="text/css">
html,body {
height:100%;
width:100%;
border:0px;
margin:0px;
padding:0px
}
.row {
width:100%;border:0px
}
.col-1 {
float:left;
height:100%;
background-color: red;
width:16.6%
}
.col-2 {
float:left;
height:100%;
background-color: blue;
width:33%
}
.col-3 {
float:left;
height:100%;
background-color: green;
width:50%
}
.col-4 {
float:left;
height:100%;
background-color: lightblue;
width:66.9%
}
.col-5 {
float:left;
height:100%;
background-color: lightgreen;
width:83.4%
}
.col-6 {
float:left;
height:100%;
background-color: orange;
width:100%
}
</style>
</head>
<body>
<div class="row" style="height:200px" >
<div class=" col-2"> <div class="row" style="height:200px" >
<div class=" col-4">444</div> <div class=" col-2">2222</div>
</div></div> <div class=" col-1">1111</div> <div class=" col-3">3333</div>
</div>
<div class="row" style="height:200px" >
<div class=" col-1">111</div> <div class=" col-5">555</div>
</div>
<div class="row" style="height:200px" >
<div class=" col-3">333</div> <div class=" col-3">333</div>
</div>
<div class="row" style="height:200px" >
<div class=" col-2">222</div> <div class=" col-4">4444</div>
</div>
<div class="row" style="height:200px" >
<div class=" col-6">6666</div>
</div>
</body>
</html>