有沒有辦法截斷（隱藏）寬表格？

我想實現一個表，跨越整個瀏覽器寬度。有沒有辦法截斷（隱藏）寬表格？

該表格包含3個表格單元格。第一個和最後一個單元格是「固定的」。這意味着：必須始終可見：瀏覽器窗口左邊框的第一個單元格，即瀏覽器窗口右邊框上的最後一個單元格。

第二個單元格（中間）包含一個多個單元格和不同長度/寬度的表格。我們稱之爲「內容表」

所以它可能看起來像這樣;

[first cell] | [content1 | content2 | content3 | content4] | [last cell]

問題是：「content-table」可能包含很多內容。由於「第一個細胞」和「最後細胞」必須始終可見，超大的「競爭表」應該部分隱藏。

最後，我需要像「overflow：hidden」這樣的東西，但是這並不適用於表格單元格。（它看起來像它不工作？）

我有一個小jsfiddl，藉以說明問題：http://jsfiddle.net/thirtydot/YRgwB/3/

，因爲昨天我在這個問題的工作 - 沒有任何想法！

希望在這裏得到任何幫助。

來源

2012-04-03 The Bndr

'sytle =「溢出：隱藏;」'在您的演示不會被幫助。我只是要改變這一點..（雖然它不會有所作爲，但它是混亂） – thirtydot 2012-04-03 09:53:13

對，它沒有幫助 - 它應該告訴你，我正在嘗試做什麼。 >我只是要改變這一點.. <好吧，謝謝。 – 2012-04-03 09:58:19

參見：http://jsfiddle.net/thirtydot/YRgwB/6/

我添加width:100%; table-layout:fixed;到您的外table。
我用overflow: hidden圍繞您的「寬桌子」包裝了div。
這適用於所有現代瀏覽器。

<table border="1" style="width:100%; table-layout:fixed;"> 
    <tr> 
     <td>first cell</td> 
     <td> 
      <div style="overflow:hidden; border:1px solid red;"> 
       <table> 
        <tr> 
         <td style="min-width:90px;">lot</td> 
         <td style="min-width:90px;">of</td> 
         <td style="min-width:90px;">content</td> 
        </tr> 
       </table> 
      </div> 
     </td> 
     <td>last cell</td> 
    </tr> 
<table>

來源

2012-04-03 09:59:05 thirtydot

爲什麼我從昨天開始就處理這個問題，並且您的工作解決方案在一分鐘內完成？我嘗試過使用表格佈局......但是，我將它應用於「內容表」，這是錯誤的。所以你的解決方案工作得很好。非常感謝！！ – 2012-04-03 11:32:36

有沒有辦法截斷（隱藏）寬表格？

回答

相關問題