【问题标题】:Bootstrap 3 tooltip arrow does not display properly with multiline messageBootstrap 3 工具提示箭头无法正确显示多行消息
【发布时间】:2019-10-15 16:18:17
【问题描述】:
我有一个带有工具提示的链接。提示信息有点长,所以分两行显示。
<a href="/link/1234" class="tooltips" title="See the comment">Comment</a>
我的问题是工具提示的箭头显示在工具提示的中间,而不是底部(见截图)
附加信息:
- 链接在表格单元格中
- 我用
$('.tooltips').tooltip({container: 'body'}); 切换工具提示
我该如何修复这个箭头?
【问题讨论】:
标签:
javascript
css
twitter-bootstrap-3
twitter-bootstrap-tooltip
【解决方案1】:
你是否设置了标签属性?,必须渲染工具提示箭头位置
<button type="button" class="btn btn-default" data-toggle="tooltip" data-placement="left" title="Tooltip on left">Tooltip on left</button>
只需在标签中应用它:
<a href="/link/1234" data-toggle="tooltip" data-placement="left" class="tooltips" title="See the comment">Comment</a>
Bootstrap 3 tooltip's doc reference