Twitter Bootstrap - how to add some more margin between tooltip popup and element

Question

i have not tryed anything since i can\'t understand where space between tooltip and element is made/added from bootstrap, normally tooltip is really near the element who trigge

Answer 1

In bootstrap.css you will find this code:

.tooltip.top {
  padding: 5px 0;
  margin-top: -3px;
}

.tooltip.right {
  padding: 0 5px;
  margin-left: 3px;
}

.tooltip.bottom {
  padding: 5px 0;
  margin-top: 3px;
}

.tooltip.left {
  padding: 0 5px;
  margin-left: -3px;
}

Change or override margins to change distance of tooltip from hovered elements.

I.E. To set bigger distance for top position of tooltip, set .tooltip.top class like this:

.tooltip.top {
  padding: 5px 0;
  margin-top: -70px;
}