I developed a simple PHP web page using Dream Weaver CS5 Version 11.0 Build 4964.
My web page consists of a table (TABLE) contains 10 table rows (TR) and each row has only one table cell (TD).
Every Table Cell (TD) has a table inside it which contains different Form Elements like Textboxes, RadioButtons, CheckBoxes and so on divided in the table columns and rows.
The problem I face is that I put every table width using the Width Property or the Style Property or using the CSS Styling Sheet so that I make the 10 tables has the same width (600 pixels for example) and to show them as they are a one table.
My HTML code is like the following:-
<html>
<body>
<table width="600">
<tr>
<td>
<table width="600">
<tr>
<td width="300">
</td>
<td width="300">
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td>
<table width="600">
<tr>
<td width="200">
</td>
<td width="200">
</td>
<td width="200">
</td>
</tr>
</table>
...
</td>
</tr>
</table>
</body>
</html>
When I browsed my php web page using Live View, the width I put did not apply and Dream Weaver extends some tables and increases the width and the tables borders does not match and some tables appear smaller widthes while others has bigger widthes.
I tried to put each table cell width to control that but it did not work too.
For example, if the width I put is 600 it becomes 641 and I tried to change it in Design and Code Views but the problem still appears.
I welcome any hint to solve that annoying problem.
Table cells and columns will always resize to accommodate the largest element in the row/column. As others have suggested, you should reconsider the use of nested tables. However, if you want to control the width of tables, you can do so with the following style rule:
This constrains the width of columns to the dimensions set in the first row.