HTML表格寬度。

在我看來，我可怕地錯過了這裏的東西，但我無法得到下表的單元格跨越整個表格。見下面附的jsfiddle鏈接：HTML表格寬度。

http://jsfiddle.net/jeremysolarz/5stQc/2/

我知道表的設計是不是很好，但我有一個遺留應用程序在這裏工作了很多 GIF間隔圖像，我想刪除此開關和更多以CSS爲中心的佈局。

請幫忙。

來源

2011-05-06 Jeremy S.

這種情況下是否需要嵌套表？如果你只有一個表，並使用<th colspan="3">這會解決這個問題嗎？對不起，如果不是這樣，但它看起來像你太過複雜！

來源

2011-05-06 08:49:09 Arj

+1嵌套表是不是在這種情況下，必要的 - 可以簡化。 – Austin 2011-05-06 08:52:49

你可以在提供的js小提琴鏈接上嘗試一下，即使沒有內表也行不通 – 2011-05-06 08:56:01

試試這個：http://jsfiddle.net/5stQc/20/ - 我認爲問題是你固定的表格寬度在CSS中最終造成了差距。 **編輯** - 刪除您的CSS中的顯示：塊是否有用;和其他一些不必要的位：http://jsfiddle.net/5stQc/28/ – Arj 2011-05-06 09:03:56

您目前正在聲明表格的寬度（在html中）和CSS中，並且這兩個值都不同，您應該按如下方式將表格封裝在div中，並刪除內聯寬度聲明。

/*框架*/

#foo{ 
    width:100%; 
    display: inline-block; 
} 
.newframeContainer { 
    padding:0; 
    margin:0 auto; 
    text-align: left; 
    width:70%; 
    height: auto; 
    border:none; 
    -moz-box-shadow: 0 4px 8px rgba(0, 0, 0, 0.5); 
    -webkit-box-shadow: 0 4px 8px rgba(0, 0, 0, 0.5); 
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.5); 
     border: 1px solid #B6B6B6; 
    -moz-border-radius: 3px; 
    -webkit-border-radius: 3px; 
    border-radius: 3px; 
}

在HTML現在應該是這樣的：

<div id="foo"> 
<table height="100%" class="newframeContainer" cellspacing="1"> 
    <tbody> 
     <tr height="27"> 
      <th colspan="3"> 
       ADAM Statistics 
      </th>    
     </tr> 
     <tr height="99%"> 
      <td class="text-bold">Total Project Budgets [USD] </td> 
      <td>test</td> 
      <td valign="top" align="right"> 
       192,609,012 
      </td> 
     </tr> 
    <tbody> 
</table> 

</div>

來源

2011-05-06 09:36:56 tcnarss

HTML表格寬度。

回答

相關問題