table with middle col to fill

by danield770

HTML

<div class="container">
    <div class="col col1">div1</div>
    <div class="col col2">div2</div>
    <div class="col col3">div3</div>
</div>

CSS

*
{
    margin:0;padding:0;
}
.container
{
    display: table;
    table-layout: fixed;
    width: 100%;
}
.col
{
    display: table-cell;    
}

.col1
{
    background: pink;
    width: 20%;
}
.col2
{
    background: orange;
    width: 100%;
}
.col3
{
    background: brown;
    width: 30%;
}