没有空格的长文本弹出框答案

【问题标题】：Popover for long text without spaces没有空格的长文本弹出框
【发布时间】：2014-03-06 07:42:05
【问题描述】：

我在网格中有一列长文本，应该在网格中截断（以 ... 结尾），但应该在弹出窗口中显示完整。

当我的文本中有空格时，弹出框显示正确。对于没有空格的文本，弹出框显示不正确。请参阅下面的示例

不正确的弹出框：

正确的弹出框：

我以这种方式显示弹出框：

<div data-toggle="popover" rel="popover"
    data-container="body" data-content="My_test_in_popover">
    My_text_with_...
</div>

我应该如何修改代码以正确显示没有空格的长文本的弹出框？

【问题讨论】：

【解决方案1】：

这是因为 Twitter 引导程序默认将max-width 属性应用于.popover 框（即max-width: 276px;）。

有两种选择：

1) 将 max-width 重置为 none 以覆盖它：

.popover {
    max-width: none;
}

2) 或者对弹出内容框使用word-wrap: break-word; CSS 声明：

.popover-content {
    word-wrap: break-word;
}

【讨论】：

这种方法也适用于我，尽管我不得不在引导程序 3 中使用“tooltip”和“tooltip-inner”。请参阅...getbootstrap.com/javascript/#callout-tooltip-multiline 中的标记部分
Tooltip 和 Popover 在 bootstrap 中是两个不同的东西。见：stackoverflow.com/questions/9843249/…

【解决方案2】：

自 2012 年以来，另一种自动换行解决方案是：

overflow-wrap:anywhere;

【讨论】：