爲什麼Bootstrap popover在目標位於固定容器內時被壓扁？

This jsfiddle說最好，但我有一個popover觸發器，工作正常。但是，如果我將容器貼上，彈出的部分就會變形。爲什麼以及如何對此進行補救？爲什麼Bootstrap popover在目標位於固定容器內時被壓扁？

<script type="text/javascript"> 
$(function() { 
    $(".popover-trigger").popover({ 
     content: function() { 
      return $("#popover-content").html(); 
     } 
    }); 

    $(".btn").click(function(){ 
     var jq = $(".popover-trigger").parent().toggleClass("affix"); 
     var state = jq.hasClass("affix") ? "" : "not"; 
     $(".state").html(state); 
    }); 
}); 
</script> 
<div id="popover-content" class="hide">Lorem ipsum dolor sit amet ... </div> 
<div class="container"> 
    <div class="row"> 
     <div class="well"> 
      <div class="popover-trigger" data-trigger="hover" data-toggle="popover" data-original-title="Popover" data-html="true"> 
       I'm <span class="state">not</span> affixed. 
       <button class="btn">Toggle</button> 
      </div> 
     </div> 
    </div> 
</div>

來源

2013-07-29 flipdoubt

不知道爲什麼，但設置popover的container選項解決了我的問題，如this fiddle所示。

來源

2013-07-29 18:42:15 flipdoubt

查看更新fiddle

我不是專家，但在你的CSS定義酥料餅的大小有助於確保它保持其形狀。這是通過調用popover {height: x; width: y}完成的。

來源

2013-07-29 17:55:41 Nathan

對不起，但高度和寬度選項並沒有解決我的問題。 – flipdoubt

正如你在自己的答案中提到的那樣，容器選項比做高度和寬度要好。 popover沒有運動！很高興你解決了這個問題。 – Nathan

爲什麼Bootstrap popover在目標位於固定容器內時被壓扁？

回答

相關問題