当使用百分比时，如何将内部表的大小设置为外部列的大小？

Question

My 'anothertablebody' will increase in size depending on what the user enters, it can increase till it exceed the outer table, I don't want it like this. I want the width to be fixed not by pixels, but according to the outer table. For eg col1 I want it 10% of the outer column, col2 30% of the outer column n col3 60% of the outer column... how can it be done?

It would be good if I can also get what the 100% width in pixel...

<table width='90%'>
<tbody id='todobody'>
    <tr>
        <td valign='top' width='100%'> <--- this is the outer column
            <div class='div1'>
                <table>
                    <tbody id='atablebody'>
                    <tr>
                    <td>col1</td>
                    <td>col2</td>
                    <td>col3</td>                                               
                    </tr>
                    </tbody>
                    <tbody id=anothertablebody'></tbody>
                </table>
            </div>
        </td>
    </tr>
</tbody>
</table>

Answer 1

<table width='90%'>
<tbody id='todobody'>
    <tr>
        <td valign='top' width='100%'> <!-- this is the outer column-->
            <div class='div1' style="width: 100%;">
                <table width="100%">
                    <tbody id='atablebody'>
                    <tr>
                    <td width="10%">col1</td>
                    <td width="30%">col2</td>
                    <td>col3</td>                                               
                    </tr>
                    </tbody>
                    <tbody id=anothertablebody'></tbody>
                </table>
            </div>
        </td>
    </tr>
</tbody>
</table>

When you say width="100%" , it means that particular tag should occupy 100% of the width available to it