Проблема с всплывающей подсказкой

Question

Независимо от того, что я делаю, моя подсказка просто отображается под соответствующей ссылкой.

У меня есть следующий стиль в моей голове:

<style> 
/* Tooltip on top */ 
.test + .tooltip.top > .tooltip-arrow { 
    border-top: 5px solid green; 
} 
</style> 

В пределах тела у меня есть:

<a class="test" href="#" data-toggle="tooltip" data-placement="top" title="ROUND">R</a> 

В нижней части все у меня есть:

<script> 
$(document).ready(function(){ 
    $('[data-toggle="tooltip"]').tooltip(); 
}); 
</script> 

Я пытаясь использовать руководство от:

http://www.w3schools.com/bootstrap/tryit.asp?filename=trybs_ref_js_tooltip_css&stacked=h 

Любые намеки или советы было бы здорово :)

Answer 1

Вы должны использовать контейнер вариант подсказке с тела значение:

<button type="button" class="btn btn-default" data-container="body" data-toggle="tooltip" data-placement="left" title="Tooltip on left" >Tooltip on left</button> 

Взгляните на массив опций в официальном документе: http://getbootstrap.com/javascript/#tooltips