截斷表中的長字符串省略號html

我在表中有一個小問題，那裏有很多單個字或多箇中等大小的字，佔用大量空間。我得到的結果看起來像http://cl。 ly/8cb66d08b6b9755ce858 即使我希望每個行都有自然增長，行也設置了寬度百分比，並且行封裝不會打破它並顯示：沒有實際上不會停止它，因爲表自然增長。我想要的是桌子留在父母的設置寬度（藍色部分有一些填充）。以及頭是一個圍繞桌子的樣式，我不能改變。截斷表中的長字符串省略號html

<div class="table-wrapper group"> 

<table class="tabular sortable" id="campaign_table" style="table-layout:fixed; word-wrap: break-word; "> 
    <thead> 
    <tr> 
    <td class="sorttable_nosort" style="border-right-width: 1px; border-right-style: solid; border-right-color: rgb(255, 255, 255); "> 
    <input type="checkbox" id="check_all_2" name="check_all_2" title="Select All" onclick="selectAllTable(document.wizard_form, check_all_2); checkIsSelected([ 'by_date', 'display_hidden', 'check_all_2']);"> 
    </td> 
    <td width="37%" style="border-right-width: 1px; border-right-style: solid; border-right-color: rgb(255, 255, 255); ">List/Campaign</td> 
    <td width="43%" style="border-right-width: 1px; border-right-style: solid; border-right-color: rgb(255, 255, 255); ">Template &amp; Segmentation</td> 
    <td width="17%" style="min-width: 140px; border-right-width: 1px; border-right-style: solid; border-right-color: rgb(255, 255, 255); ">Date Sent</td> 
    <td width="4%">Sent</td> 
    </tr> 
    </thead> 

    <tbody class="campaign-table"> 
    <input type="hidden" id="campaignNum" name="campaignNum" value="1"> 
    <tr class="evenRow"> 
    <td> 
     <label> 
     <input type="checkbox" id="select_981" name="select_981" onclick="checkIsSelected(['by_date', 'display_hidden']);"> 
     </label> 
    </td> 
    <td>0ThisIsAReallyLongNameThatHasNoSpacesHopefullyMaxxxxxxxxxxxxxxxxxxxxxxxxxxx</td> 
    <td>ThisIsAReallyLongNameThatHasNoSpacesHopefullyMax <br> (BiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiggggggggggggggggggggggggggggggggggggggggText)</td> 
    <td>11/08/10 4:28 PM</td> 
    <td>0</td> 
    </tr> 
     </tbody> 
    <tfoot></tfoot></table> 
     </div>

注意大部分類和樣式都是從某個JavaScript文件生成的。如果你知道任何與jQuery 1.8一起工作的插件（我已經看到一些可以工作但是需要1.3的插件）。我想知道是否可能需要手動更改表格列的寬度，因爲其中的數據和修改該數據不會自動修改列的寬度。

來源

2010-11-10 Craig

問題的一部分可能是您已將單詞包裝的CSS屬性分配給表，但不包含包含數據的實際單元格。查看您是否可以分配一個樣式或類，以便在實際的<td>元素上設置word-wrap: break-word;屬性。

另一個需要考慮的問題是使用軟連字符。如果可以 - 在文本呈現到頁面之前或使用JavaScript呈現在瀏覽器中的任一服務器端 - 將此soft hyphen character插入到您的文本中，那麼瀏覽器將知道此時會打破您的話。

最後，看看在表的開頭應用<colgroup>和<col>元素是否有助於清理表結構並更明確地定義列寬。這最後一點可能不會影響文字的換行和連字符，但可能有助於表格佈局。

來源

2010-11-10 22:31:06

截斷表中的長字符串省略號html

回答

相關問題