Bootstrap Popover的文字太长了

Question

我正在使用Twitter Bootstrap为div创建一个popover，但文本太长，似乎超出了popover的最大宽度。

我想在文本末尾显示...所以我尝试使用<li>设置text-overflow:ellipsis;样式，但这不起作用。

的javascript：

$(div).popover({
  placement : 'right',
  title : function (){
    return '<span class="title">Title</span>';
  },
  content: function (){
    return '<div class="body"><ul>'
           + '<li>This_is_a_long_long_long_long_long_long_long_long_long_long_long_long_long_text</li>'
            + '</ul></div>'
   },
   container : 'body',
   html : 'true'
 });

如何正确包装文字？

Answer 1

我在页面上的文字有'...'，我希望popover显示全文（这似乎比截断popover更有用）。要做到这一点，只需覆盖popover-content样式：

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

Answer 2

http://jsfiddle.net/isherwood/W6a3B

.popover-content, .popover-content .body {
    width: 100%;
}
.popover-content li {
    overflow: hidden;
    text-overflow: ellipsis;
}