Bootstrap 3 - Tooltips - Boutons - rembourrage disparaît

Je suis en train de tester Bootstrap et j'ai un problème stupide. Lorsque j'utilise des info-bulles sur plusieurs boutons (dans la même rangée) au début, tous les boutons sont séparés par plusieurs pixels. Lorsque l'info-bulle apparaît, l'espace entre les boutons disparaît.Bootstrap 3 - Tooltips - Boutons - rembourrage disparaît

Mon code:

<button type="button" class="btn btn-default" data-toggle="tooltip" id="btn01" 
data-placement="top" title="Tooltip on top">Button with tooltip</button> 

<button type="button" class="btn btn-default" data-toggle="tooltip" id="btn02" 
data-placement="left" title="Tooltip on left">Button with tooltip</button> 

<button type="button" class="btn btn-default" data-toggle="tooltip" id="btn03" 
data-placement="right" title="Tooltip on right">Button with tooltip</button> 

<button type="button" class="btn btn-default" data-toggle="tooltip" id="btn04" 
data-placement="bottom" title="Tooltip on bottom">Button with tooltip</button> 

<script src="http://code.jquery.com/jquery.js"></script> 
<script src="js/bootstrap.js"></script> 

<script type="text/javascript"> 
    $('document').ready(function() { 
     $('#btn01').tooltip(); 
     $('#btn02').tooltip(); 
     $('#btn03').tooltip(); 
     $('#btn04').tooltip(); 
    }); 
</script>

Source

2014-06-28 user3785890

Pourriez-vous reproduire votre erreur avec jsfiddle? En voici un que j'ai créé, mais ça marche très bien http://jsfiddle.net/wuSkd/ – kamil

probablement pas lié à l'info-bulle, mais plutôt à votre propre css (je suppose qu'il y a un autre padding \ border \ quelque chose sur hover pour les boutons). S'il vous plaît modifier jsfiddle @ kamil avec votre propre code. Aussi, pourquoi appelez-vous 'tooltip()' quatre fois sur leurs identifiants au lieu d'une fois sur leurs classes? – yuvi

problème déjà résolu en ajoutant à l'intérieur des balises bouton ...

data-container="body"

D'ailleurs ... Je sais encore rien JS. J'apprends. Donc, je comprends que je pourrais ajouter par exemple la classe clsTooltip aux 4 boutons et ensuite ... ¿utiliser ceci ...?

$('document').ready(function() { 
    $('.clsTooltip').tooltip(); 
});

Merci beaucoup!

Source

2014-06-29 18:22:31 user3785890

Bootstrap 3 - Tooltips - Boutons - rembourrage disparaît

Répondre

Questions connexes