colspan messes with fixed width table

You could also use colgroup and col to set the width:

<table>
    <colgroup>
        <col class="short" />
        <col span="2" class="long" />
    </colgroup>
    <tr>
        <td>Short</td>
        <td>Long long long long</td>
        <td>Long long long long</td>
    </tr>
    <tr>
        <td>Short</td>
        <td>Long long long long</td>
        <td>Long long long long</td>
    </tr>
    <tr>
        <td>Short</td>
        <td>Long long long long</td>
        <td>Long long long long</td>
    </tr>
</table>

With this CSS:

table { width: 100%; }
.short {
    background: lightblue;
    width: 20%
}
.long {
    background: lightgreen;
    width: 40%;
}
.multiCells { background: #F3A633; }

This way you do not need to give every td a class, makes it easier when you want to change the classname.

JSFiddle demo

colgroup MDN Article

change the table-layout: fixed to auto

table {
  table-layout: auto;
}

Find the working demo here: http://jsbin.com/atohug/2/edit