Question

问题：

我有一个包含列表组的Bootstrap面板。如果我向最后一个列表组项添加工具提示，则面板的下边框正在消失。

解决方案尝试：

我怀疑两个问题中的一个可能导致这个问题：

当工具提示出现时，面板的高度会减小。
列表组项的下边框覆盖了面板的下边框。

我开始怀疑＃2，因为bootstrap css中有以下内容：

.panel>.list-group:last-child .list-group-item:last-child {
    border-bottom:0;
    border-bottom-right-radius:3px;
    border-bottom-left-radius:3px
}

由于工具提示会向列表组添加另一个元素，因此列表组项不再是最后一个子项，因此此规则将停止应用。但是，在将.list-group-item:last-child更改为.list-group-item:last-of-type后会有效地忽略工具提示，问题仍然存在。

Answer 1

您可以使用container上的tooltip()选项。这会将popover附加到父row，而不会影响list-group的样式..

$('.list-group-item').tooltip({container:'.row'})

http://www.bootply.com/WpRFe2EyaM

阻止Bootstrap工具提示隐藏面板底部边框

1 个答案: