天魔窟

相信每个 Web 设计人士都遇到过这样的情况：

已经制定了表格单元格（或者其他容器）的宽度，但是如果单元格内的文字是一个很长的单词，确切说是一串没有空格的连续字符，例如 aaaaaaaaaaaaaaaaaaaaaaabbbbbb，这串字符的显示长度如果大于该容器的宽度，一般情况下不会自动这行而会撑开容器，从而破坏布局。

一种目前比较完美的解决办法是，设定下面的 CSS（以 table 为例）：

table {
    table-layout: fixed;
    width: 100%;
    overflow: hidden;
    word-wrap: break-word;
    border: 1px solid #f00; /* 这行非必要 */
}

其中 word-break 属性只有最新的浏览器（Fx 3.5+、Chrome、Safari）才支持，而 overflow 则是 fail-safe，干脆隐藏超长的部分。原文作者说这个方案在 IE 下也行，我没测试，don't care, fuck IE!

credit