Question

我一直在使用bootstrap使我的页面移动友好。我的内容是动态生成的，所以如果有人放了一个非常长的文本（比如lorem ipsum），那就好了，因为我有一个截断，但是我遇到了很长的单词问题。

见实际情况：Actual

这就是我希望的样子：Intended

我尝试了以下解决方案无济于事：

我正在使用Bootstrap 3.3.2，Twig和Symfony。这是代码

<tr class="row">
<td class="col-sm-12 clickable" data-toggle="modal" data-target="#myModal-{{pregunta.id}}">
    <div style="height:150px;overflow:hidden; text-overflow:ellipsis;">
        {{ pregunta.contenido|markdown|raw|truncate(150) }}
    </div>
</td>

以下是它的渲染方式：

<tr class="row">
<td class="col-sm-12 clickable" data-toggle="modal" data-target="#myModal-4">
    <div style="height:150px;overflow:hidden; text-overflow:ellipsis;">
        <p>PreguntaaaaaaaaaaaaaaaaLargaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaioooooooooooo</p>

    </div>
</td>

我还添加了属性

p{
word-wrap: break-word;}

对于我的CSS，如果我检查段落，它有它，还添加了空格：正常;并且它不起作用

Answer 1

如果在元素上指定宽度，它应该自行换行而不需要任何其他内容。你试过吗？此外，我认为只有指定宽度

时自动换行才有效

Word-Wrap在自助流体容器中不起作用的长单词

1 个答案: