[html] Table columns, setting both min and max width with css

I would like to have a table which in the columns can stretch but I'm having a little trouble with min and max width in css.

It also seems that theres some conflicting answers around how this works:

• min/max width should work: Prevent text from overlap table td width
• min/max width are unsupported: Min-width and max-height for table attributes

I would like to have the following

table{
   width:100%;
}
.a, .b, .c
{
    background-color: red;
}
.a
{
    min-width: 10px;
    max-width: 20px;
}
.b
{
    min-width: 40px;
    max-width: 45px;
}
.c
{
}

<table>
    <tr>
        <td class="a">A</td>
        <td class="b">B</td>
        <td class="c">C</td>
    </tr>
</table>

Is there a way of achieving this without javascript (ie constrained stretching of columns with a table)?

• I only need this to work with CSS3 + HTML5
• a jsfiddle with stuff not expanding: http://jsfiddle.net/4b3RZ/10/
• if I set only min-width on the columns i get a proportional stretch:http://jsfiddle.net/4b3RZ/8/

below is a table of what actually gets rendered for some different css setups: