With the below code, I get the columns size being different (esp the last column is small) I would like to have all the three columns to be of same size.Thanks.
<html>
<body>
<h4>Two rows and three columns:</h4>
<table border="1" width="100%" height="400" align="top">
<tr style="height: 1">
<td>
<table width="100%" border="2" height ="100" align="top">
<tr>
<td>1-1</td>
<td>1-2</td>
</tr>
<tr>
<td>1-3</td>
<td>1-4</td>
</tr>
</table>
</td>
<td>
<table width="100%" border="2" height ="100" align="top">
<tr>
<td>2-1</td>
<td>2-2</td>
</tr>
<tr>
<td>2-3</td>
<td>2-4</td>
</tr>
</table>
<td>
<table width="100%" border="2" height ="100" align="top">
<tr>
<td>3-1</td>
</tr>
<tr>
<td>3-2</td>
</tr>
</table>
</td>
</tr>
<tr style="vertical-align: top">
</td>
<td>
<table width="100%" border="2" height ="100">
<tr>
<td>4-1</td>
<td>4-2</td>
</tr>
<tr>
<td>4-3</td>
<td>4-4</td>
</tr>
</table>
<td>
<table width="100%" border="2" height ="100">
<tr>
<td>5-1</td>
<td>5-2</td>
</tr>
<tr>
<td>5-3</td>
<td>5-4</td>
</tr>
</table>
<td>
<table width="100%" border="2" height ="100">
<tr>
<td>6-1</td>
</tr>
<tr>
<td>6-3</td>
</tr>
</table>
</body>
</html>
Insert a colgroup
element in your table:
<table>
<colgroup>
<col style="width: 33%" />
<col style="width: 33%" />
<col style="width: 33%" />
</colgroup>
<tr>
...
</tr>
</table>