如何防止 Bootstrap 在弹出窗口中自动换行

How to prevent Bootstrap from breaking lines automatically in popovers

我想用 Bootstrap 的弹出窗口添加工具提示,如下所示:

<ul>
     <li>Entry 1 ....................................................................</li>
     <li>Entry 2 ....................................................................</li>
     <li>Entry 3 ....................................................................</li>
</ul>

但是,Bootstrap 会在某些时候自动换行。我已经设置 html: true 并尝试添加一个 div 元素:

<div style="word-break: keep-all>
<ul>
     <li style="word-break: keep-all"></li>
</ul>
</div>

但还是断线了。 是否可以避免自动换行并可能添加水平滚动条?我怎样才能指定工具提示区域的宽度?

你可以试试

<ul>
   <li style="white-space: nowrap"></li> 
</ul>

white-space: nowrap 将强制所有内容在一行中。

您需要向 .popover-content class 添加一个 overflow-x: scroll;,并向每个 li 添加一个 white-space: nowrap

https://jsfiddle.net/nrpe1m05/