two column style sheet layout
<div id="container">
<div id="leftcolumn" style="min-height: 300px;">
<h2>Features</h2>
</div>
<div id="rightcolumn" style="min-height: 300px;">
<h2>Benefits</h2>
</div>
<div class="clear"></div>
</div>
<div id="container">
<div id="leftbottomcolumn" style="min-height: 100px;">
<h2>Features</h2>
</div>
<div id="rightbottomcolumn" style="min-height: 100px;">
<h2>Benefits</h2>
</div>
<div class="clear"></div>
</div>
#container {
width:480px;
}
#leftcolumn {
width: 220px;
float: left;
margin: 5px;
padding: 5px;
background: #BBE3A8;
font-size: 11px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
}
#rightcolumn {
width: 220px;
float: right;
margin: 5px;
padding: 5px;
background: #BBE3A8;
font-size: 11px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
}
#leftbottomcolumn {
width: 220px;
float: left;
margin: 5px;
padding: 5px;
background: #BBE3A8;
font-size: 11px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
}
#rightbottomcolumn {
width: 220px;
float: right;
margin: 5px;
padding: 5px;
background: #BBE3A8;
font-size: 11px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;}
.clear { clear: both;}