確保表格單元格寬度得到遵守

Question

我有一個帶有多列的HTML <table>。在任何情況下，我如何確保給定的單元格/列寬度受到尊重？也就是說，如果我給一個單元格的寬度爲100px，並且文本內容很長（超過100個字符而沒有任何空格），則文本內容應該尊重100px的寬度並換行到下一行。

I已經嘗試使用word-wrap:break-word，但這不起作用。

請幫幫我。

Answer 1

使用table-layout: fixed確保您的td寬度得到尊重。

查看MDN docs瞭解更多信息。

編輯

像這樣的東西應該爲你工作：

table { 
    table-layout: fixed; 
} 
td { 
    color:white; 
    width:50px; 
    background-color:Blue; 
    word-wrap: break-word; 
    max-width:50px; 
} 

這裏的a working fiddle證明。