2

Bootstrap JSのPopover（ this ）を実装しようとしていますが、何らかの理由で想定どおりに表示されません。

これは私が得ているものです

ご覧のとおり、ポップオーバーの本体が左にずれており、境界線が少し壊れています。

これが私のコードです

<a class="btn success" id="previewBeforeSubmit"  href="#"
 data-original-title="Test" data-content="Lorem Ipsum">Save Changes</a>

<script type="text/javascript">
   $("#previewBeforeSubmit").popover({position: 10, placement: 'above'});
</script>

これを引き起こしているものについての手がかりはありますか？

4

4 に答える 4

6

おそらくCSSの競合です。既存のcssルールは、ポップオーバーの属性に属性を追加している可能性があります。FireBugでの検査から始めて、どのcssルールがどこから継承されているかを確認します。

于 2011-09-26T07:07:19.973 に答える
3

コンテナの例を使用していると思います。はいの場合は、行をコメントアウトすることでこの問題を解決できますmargin: 0 -20px。次のブロックに表示されます。

  .content {
    background-color: #fff;
    padding: 20px;
    margin: 0 -20px;
    ...
  }
于 2012-01-09T17:49:53.697 に答える
2

それはマージンのことです、追加してください

.popover .content {
margin: 0;
}

これで問題が解決するはずです。

于 2011-10-19T00:53:29.543 に答える
0

より普遍的な修正は、要素に追加data-container='body'して、要素から (および要素を介して) CSS ルールを継承しないようにすることです。

于 2016-02-17T21:09:23.800 に答える