css - 当我将滚动条添加到弹出窗口时，引导弹出箭头消失

Question

当没有滚动条时我得到箭头，但是当我将滚动条添加到弹出框内容时它消失了。我无法让它在 jsfiddle 上运行。所以我在这里发布代码。

CSS

.pop-div .popover {
    max-width: 310px;
    height: 250px;
    overflow-y:scroll;
}

HTML

<li>
    <div class="pop-div">
        <a href="#" id="myid" rel="popover" >click me</a>
    </div>
</li>

JAVASCRIPT

$("a[rel=popover]").click(function(e) {
    e.preventDefault();
    $.ajax({
        url: '/myurl',
        success: function(data) {
            $("#myid").popover({
                placement: 'top',
                title:'title',
                html:true,
                content:data
            });
        }
    });
 });

Answer 1

那是因为箭头应该出现在弹出框下方，但是由于您告诉它垂直滚动，它不能“离开”父级。我建议您使用.popover-contentBootstrap 提供的类来启用仅滚动内部内容

CSS

.pop-div .popover-content {
    max-width: 310px;
    height: 250px;
    overflow-y:scroll;
}

演示小提琴

Answer 2

我在 popover-content 和 max-width:100% 添加了 overflow:auto 来弹出它对我来说效果很好

.popover .popover-content {

溢出：自动；}