twitter-bootstrap-rails最大列宽

Question

我正在使用twitter-bootstrap-rails设计一个非常简单的应用程序。我的模型索引页面中有一个显示数据的表格，它看起来非常棒。问题是，如果某人输入了一个非常长的字符串（例如URL），那么这个字段的宽度会拉伸并挤压所有其他字段。我想要一些方法来强制列的宽度，并告诉浏览器打破真正的长词。

我到目前为止所做的努力是每个<th>我已经添加了一个类，并尝试使用CSS来控制宽度。下面是一个例子

<table> 
    <thead> 
    <tr> 
     <th class="column1"> etc 
     <th class="column2"> etc 
    </tr> 
    </thead> 
    <tbody> 
    <tr> 
     <td class="column1"> etc 
     <td class="column2" etc 
    </tr> 
    </tbody> 
</table> 

然后，我在我的样式表

th.column1 { width: 300px; 
    word-wrap:break-word;} 
td.column1 { width: 300px; 
    word-wrap:break-word;} 

至今未为我工作用这个，我不知道我是否需要进行这么多的重复我的代码。

Answer 1

我最终修复了我自己的问题。我所做的是使用最大宽度，而不是宽度

th.column1 td.column1 { max-width:300px; word-wrap:break-word; }