0

I have a kendo ui dataviz chart inside a bootstrap navs like this (or something like it) :

<ul class="nav nav-tabs navbar-static">
    <li class="active">
        <a href="#myTab" data-toggle="tab">Ranking ACT</a>
    </li>
</ul>
<div class="tab-content">
    <div id="myTab" class="tab-pane">
        <div id="myKendoChart"></div>
    </div>
</div>

The problem is that when I have a hover that shows the toolip on a series, it goes behind the tab section, hiding part of its content.

How can I set the toolip to be always on top (over) ?

Thank you.

Ankit Pise
  • 1,243
  • 11
  • 30
Raphael
  • 171
  • 1
  • 3
  • 12

1 Answers1

1

Set a z-index very high, 1000 for example and position relative or absolute to the class of tooltip element (if needed) and change the container overflow property to visible => overflow: visible;.

Alberto
  • 1,853
  • 1
  • 18
  • 22
  • Did you apply it to the correct element? Did you set the position of that element to relative or absolute? – Alberto Feb 26 '14 at 07:44
  • Kendo sets it to absolute automatically. I did apply to the correct element i think, i added a style in my html like this: – Raphael Feb 26 '14 at 12:54
  • Sorry I didn't remember that, so the problem is probably due to the container (
    or
    ). Change the container overflow property to visible => overflow: visible;
     – Alberto Feb 26 '14 at 13:52
  • Great! Have a nice day – Alberto Feb 26 '14 at 19:32