twitter bootstrap popover显示但看起来很奇怪 - rails

Question

您好我正在使用seyhunak / twitter-bootstrap-rails gem的twitter bootstrap popover功能。

我在视图中有以下代码：

<ul class="nav nav-pills subnav">
  <li>
    <a class="label-with-popover" data-content="popover content" data-title="popover title">Home Valuations:</a>
  </li>
</ul>

我的page.js.coffe中的以下内容

jQuery ->
$('.label-with-popover').popover()

出现了弹出框，但看起来如此：

Bootstrap popover显示奇怪，通过它有额外的垂直线：有谁知道如何解决这个问题？

如果您需要更多信息，请与我们联系。

Answer 1

你在Bootstrap CSS和你为项目编写的CSS之间有一堆冲突。将来，您应该考虑为自己的通用类（如.arrow）使用命名空间，否则您的CSS将干扰使用此类常用类名的第三方库（如Bootstrap）。

以下是对小提琴的编辑：http://jsfiddle.net/5rT9t/1/

我删除了margin上的.content声明，padding上的.arrow值，并严格用于演示，添加了一个容器div以抵消弹出窗口，因此您可以看到整件事。