HTML表格的格式不正確

Question

我試圖所以它看起來像這樣格式化這個HTML： http://iforce.co.nz/i/tryvopws.4xy.png

我似乎無法得到它雖然沒錯！我可以讓頂端部分工作，但其他方面調整爲非常小。我希望它看起來像圖片。

任何幫助表示讚賞！

<table cellspacing="0" border="0" width="100%"> 
     <tr class="s4-die"> 
     <td class="ms-pagebreadcrumb"> 
     </td> 
     <td valign="top" width="100%"> 
       <WebPartPages:WebPartZone runat="server" FrameType="TitleBarOnly" ID="WebPartZone1" Title="loc:Top" /> 
       &#160; 
     </td> 
     </tr> 
     <tr> 
     <td> 
     <table width="100%" cellpadding="0" cellspacing="0" style="padding: 5px 10px 10px 10px;"> 
      <tr> 
      <td valign="top" width="60%"> 
       <WebPartPages:WebPartZone runat="server" FrameType="TitleBarOnly" ID="Left" Title="loc:Left" /> 
       &#160; 
      </td> 
      <td>&#160;</td> 
      <td valign="top" width="40%"> 
       <WebPartPages:WebPartZone runat="server" FrameType="TitleBarOnly" ID="Right" Title="loc:Right" /> 
       &#160; 
      </td> 
      <td>&#160;</td> 
      </tr> 
      <tr> 
      <td valign="top" width="60%"> 
       <WebPartPages:WebPartZone runat="server" FrameType="TitleBarOnly" ID="Left2" Title="loc:Left" /> 
       &#160; 
      </td> 
      <td>&#160;</td> 
      <td valign="top" width="40%"> 
       <WebPartPages:WebPartZone runat="server" FrameType="TitleBarOnly" ID="Right2" Title="loc:Right" /> 
       &#160; 
      </td> 
      <td>&#160;</td> 
      </tr> 
     </table> 
     </td> 
     </tr> 
    </table> 

Answer 1

你必須和額外的列刪除

<td class="ms-pagebreadcrumb"> 
</td> 

或把它變成一排

<tr class="s4-die"> 
    <td class="ms-pagebreadcrumb"> 
    </td> 
</tr> 
<tr class="s4-die"> 
    <td valign="top" width="100%"> 

Answer 2

的第一行，你需要添加colspan="2"，使其跨越全長爲在你的例子中顯示。

此外，您不需要在該表中添加另一個表。這導致你的一個td比另一個大，看起來很亂。使用colspan,cellspacing和cellpadding你應該能夠完成你所需要的。