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

Question

这就是:我试图在Twitter Bootstrap 3中使用jQuery Sparklines.在这个过程中,Sparklines的工具提示松散了样式,显然Bootstrap css覆盖了Sparklines JS中的某些内容.

据我所知,它与tooltip选择器有关.

这是它应该如何看的一个例子.这没有 Bootstrap css.指向不同的迷你图,并看到一个漂亮的工具提示值悬停: JSfiddle,它应该如何看待

不幸的是,当我添加Bootstrap css时,会发生什么: JSfiddle,它与Bootstrap css的外观如何.

我确信这很简单,但由于Sparklines的默认css被硬编码到js中,我出海了.

任何指针都将非常感激.

Answer 1

我发现以下更好的方法来反击bootstrap css

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

Answer 2

我发现这最适合根据内容调整大小.

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

Answer 3

好!我好像已经解决了.不完美,但现在已经足够好了:为了进一步参考其他人:在Sparkline中:添加到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;

不完美,但它的确有效.

Answer 4

我有同样的问题,你可以使用这个CSS

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