Aligning elements in table - html

Question

I would like for top 4 elements to stretch across the top, and bottom two to also look like they belong to the same table, stretch and not be so squeezed. Can I accomplish this without adding empty <td>s?
This is how it looks like right now:
http://www.w3schools.com/code/tryit.asp?filename=F0OOEL3HH55Y
My code:
<table cellspacing="2" cellpadding="2" width="650" border="0">
<tr>
<td height="8" class="header" width="300">Weight Per Book (lb.)</td>
<td height="8" class="header" width="300">Cost per Book</td>
<td height="8" class="header" width="200">Quantity for whole order</td>
<td height="8" class="header" width="400">Capability Complexity Level For TO</td>
</tr>
<tr>
<td height="16">2.0</td>
<td height="16">0.00</td>
<td height="16">0</td>
<td height="16">4</td>
</tr>
<tr valign="bottom">
<td class="header">Distribute ID Order to Home Plant</td>
<td class="header">Distribute All OTR's to Home Plant</td>
</tr>
<tr>
<td>No</td>
<td>No</td>
</tr>
</table>

Answer 1

You can use the colspan attribute to do that. This attribute define the number of columns a particular cell should span.
Here is an example:
<table cellspacing="2" cellpadding="2" width="650" border="0">
<tr>
<th colspan="4">Production</th>
</tr>
<tr>
<td height="8" class="header" width="300">Weight Per Book (lb.)</td>
<td height="8" class="header" width="300">Cost per Book</td>
<td height="8" class="header" width="200">Quantity for whole order</td>
<td height="8" class="header" width="400">Capability Complexity Level For TO</td>
</tr>
<tr>
<td height="16">2.0</td>
<td height="16">0.00</td>
<td height="16">0</td>
<td height="16">4</td>
</tr>
<tr valign="bottom">
<td colspan="2" class="header">Distribute ID Order to Home Plant</td>
<td colspan="2" class="header">Distribute All OTR's to Home Plant</td>
</tr>
<tr>
<td colspan="2">No</td>
<td colspan="2">No</td>
</tr>
</table>
Hope this helps!