Three columns layout with elastic center

by mottalrd

HTML

<div class="col1">Column1</div>
<div class="col3">Column3</div>
<div class="col2">
    <div class="inner">
        Column2    
    </div> 
</div>

CSS

.col1 { 
    background-color: #ddf; 
    float: left;
    margin-left:50px;
}
.col2 { 
    background-color: #dfd; 
    float: none;    
}
.col3 { 
    background-color: #fdd; 
    float: right;
    margin-right: 50px;
}
.inner{
    width: 100%;
    padding-left: 45%;
}