I'm having a problem where my tooltip is displaying below the relevant link, no matter what I try.
In the style section of my code, I have this:
<style>
/* Tooltip on top */
.test + .tooltip.top > .tooltip-arrow {
border-top: 5px solid green;
}
</style>
Within the body, I've added:
<a class="test" href="#" data-toggle="tooltip" data-placement="top" title="ROUND">R</a>
And at the bottom of everything, I included:
<script>
$(document).ready(function(){
$('[data-toggle="tooltip"]').tooltip();
});
</script>
I was following a guide from:
http://www.w3schools.com/bootstrap/tryit.asp?filename=trybs_ref_js_tooltip_css&stacked=h
Any advice or suggestions would be greatly appreciated :)