css - 自动换行 :break-word - don't break strings

Question

我想在我的 View 列表中显示来自数据库的所有评论。但有时，评论会很长。我试图用 word-wrap:break-word 来“打破”它们，但没有结果——像这样的评论

aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa

扩展我的视野..

我想展示:

aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa

aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa

怎么做？ CSS Width 属性也不起作用。

这是我的代码:

<table style="width: 100%;">
@foreach (var comment in Model.commentList)
{ 
    <tr style="border-bottom:1pt solid black;">
        <td style="width: 30%;">
            <br />

            @comment.UserName<br /><br />
            @comment.AddDate
            
        </td>
        <td style="word-wrap:break-word; width: 70%;">
            <br />
            @comment.Content
            
        </td>

    </tr>
    

}

</table>

Answer 1

实际上 word-wrap: break-word 在表格中似乎不能正常工作。不过有一个修复方法。尝试以下代码(注意 table 标记中的附加 table-layout: fixed)。

<table style="table-layout: fixed; width: 100%;">
@foreach (var comment in Model.commentList)
{ 
    <tr style="border-bottom:1pt solid black;">
        <td style="width: 30%;">
            <br />
            @comment.UserName<br /><br />
            @comment.AddDate
        </td>
        <td style="word-wrap:break-word; width: 70%;">
            <br />
            @comment.Content
        </td>
    </tr>
}
</table>