jquery - jQuery Sparklines 和 Twitter Bootstrap 3 - 工具提示样式覆盖？

Question

就是这样：我正在尝试将 jQuery Sparklines 与 Twitter Bootstrap 3 一起使用。在此过程中，Sparklines 的工具提示样式松散，很明显 Bootstrap css 覆盖了 Sparklines JS 中的某些内容。

据我所知，它与tooltip选择器有关。

这是它的外观示例。这没有Bootstrap css。指向不同的迷你图，并看到一个漂亮的工具提示，其中值悬停： JSfiddle，它应该看起来如何

不幸的是，当我添加 Bootstrap css 时会发生什么： JSfiddle，它在 Bootstrap css 中的外观。

我相信这很简单，但是由于 Sparklines 的默认 css 是硬编码到 js 中的，所以我在海上。

任何指针将不胜感激。

score 100 · Accepted Answer

我发现以下方法可以更好地对抗引导 css

.jqstooltip {
  -webkit-box-sizing: content-box;
  -moz-box-sizing: content-box;
  box-sizing: content-box;
}

score 9 · Accepted Answer

我发现这最适合让它根据内容调整大小。

.jqstooltip {
  width: auto !important;
  height: auto !important;
}

score 5 · Accepted Answer

我有同样的问题，你可以使用这个 css

  .jqstooltip{ 
       width:50px;
       height:25px!important;
    }

score 5 · Accepted Answer

出色地！我似乎已经解决了。不完美，但现在已经足够了：供其他人进一步参考：在 Sparkline js 中：添加到第 354 行：

'padding: 5px 5px 15px 5px;' +
'min-height: 30px;' +
'min-width: 30px;' +

.并将第 871 行从：

this.width = this.sizetip.width() + 1;

至：

this.width = this.sizetip.width() + 12;

不完美，但它有效。

score 2 · Accepted Answer

2

.jqstooltip {
  width: auto !important;
  height: auto !important;
}

于 2016-08-25T13:04:53.653 回答

5 回答 5