引导弹出窗口居中对齐答案

【问题标题】：Bootstrap popover align in middle引导弹出窗口居中对齐
【发布时间】：2016-08-18 13:56:45
【问题描述】：

我正在制作带有亮点的交互式 svg 地图。现在我正在使用引导弹出窗口，但它在 svg 上方对齐。我想要的是将它直接放在中间的 svg 或其他东西上。

这是一个FIDDLE，看看它是如何建立起来的。

正如您在 Fiddle 中看到的，我在 svg 元素上触发了弹出框。

如何访问这个特定的弹出框？我是这样想的：

$('svg').click(function(){
    $('div').find('.popover').css('top', '100px','!important');
})

但是当你第二次点击时（关闭时）它设置为 100px

【问题讨论】：

【解决方案1】：

我已经准备好找到解决方案，将 svg 包装在一个 div 中并给它一个 position: relative 和 display: inline-block 而不是给 popover class:

.popover {
        .pos-t-l(50%, 50%) !important; (mixin position top-left)
        .translate(-50%; -50%);
    }`

【讨论】：