Ausrichten von Elementen in Tabelle

Question

Ich möchte, dass die oberen 4 Elemente über die Oberseite strecken und die unteren beiden auch aussehen, als gehörten sie zum selben Tisch, dehnen und sind nicht so gequetscht. Kann ich dies ohne Hinzufügen von leeren <td> s erreichen?

Dies ist, wie es wie jetzt aussieht: http://www.w3schools.com/code/tryit.asp?filename=F0OOEL3HH55Y

Mein 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

können Sie das colspan Attribut verwenden, das zu tun. Dieses Attribut definiert die Anzahl der Spalten, die eine bestimmte Zelle umfassen sollte. Hier

ein Beispiel:

<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>

hoffe, das hilft!