Twitter Bootstrap - jak dodać trochę więcej marginesu między wyskakującym podpowiedziami do podpowiedzi a elementem

Question

Nie próbowałem niczego, ponieważ nie mogę zrozumieć, gdzie spacja między elementem a elementem jest tworzona/dodawana z bootstrapu, zwykle podpowiedź jest naprawdę blisko elementu, który wyzwala zdarzenie z podpowiedziami.

Po prostu chciałbym, aby podpowiedź otwierała się trochę od elementu, aby dodać trochę więcej marginesu z podpowiedzi i eleemnt, co mam na myśli.

Chciałbym zrozumieć, jak to zrobić w css, jeśli to możliwe, a jeśli jest to możliwe, aby go zarówno dla prawo, lewo, górę, podpowiedzi dolnych

Nadzieja pytanie jest jasne.

ten sposób podpowiedzi wygląda na mojej aplikacji:

i to jest to, co chciałbym robić i jak powinny wygląda po

Answer 1

Jest to domyślny CSS dla podpowiedzi na szczycie :

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

można zastąpić go w swoim własnym CSS:

.tooltip.top { 
    margin-top: -10px; 
} 

Uwaga Ten kod zadziała tylko praca podpowiedź na górze, będziesz nedd dostosowanie CSS dla 3 innych orientacjach:

.tooltip.top { margin-top: -10px; } 
.tooltip.right { margin-left: 10px; } 
.tooltip.bottom { margin-top: 10px; } 
.tooltip.left { margin-left: -10px; } 

Answer 2

W bootstrap.css znajdziesz ten kod:

.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; 
} 

Zmień lub zastąp marginesy, aby zmienić odległość etykiety narzędzi od elementów podmienionych.

I.E. Aby ustawić większy dystans do górnego położenia podpowiedzi, ustaw .tooltip.top klasa tak:

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