<html>
<head>
<script>
    function hide() {
        var cell2 = document.getElementById("cell2");
        cell2.setAttribute("style", "border:2px solid green;display:none;width:0%;");
    }
    function show() {
        var cell2 = document.getElementById("cell2");
        cell2.setAttribute("style", "border:2px solid green;display:normal;width:33%;");
    }
</script>
</head>
<body onload="show()">
<table width="80%">
    <tr>
        <td width="33%" style="border: 2px solid red;">
            Cell 1 (width=33%).
        </td>
        <td id="cell2" style="border:2px solid green;display:none;width:0%;">
            Cell 2 (width=33%).
        </td>
        <td width="*" style="border: 2px solid blue;">
            Cell 3 (width=*) - should be 67% when cell 2 is hidden, 33% when cell 2 is visible.
        </td>
    </tr>
</table>
</body>
</html>