CODEWITHSUNDEEP
csstwitter-bootstraptwitter-bootstrap-3
Amy Neville
Amy Neville

Reputation: 10581

Adding Bootstrap Tooltip to a <span> inside a <div>?

I have a span inside a div and I'm trying to add a Bootstrap 3 tooltip to it:

<div style="display:inline-block;margin-right:10px;">
  <h3>
    <span class="label label-default">
      Chickens: <span style="color:#fff;">3</span>
    </span>
  </h3>
</div>

How do I get this to work?

Upvotes: 4

Views: 17969

Answers (2)

Adam Buchanan Smith
Adam Buchanan Smith

Reputation: 9449

I think you are asking for something like this: https://jsfiddle.net/g74Ep/471/

<div style="display:inline-block;margin-right:10px;margin-top: 40px;">
  <h3>
    <span class="label label-default" href="#" data-toggle="tooltip" title="3">
      Chickens: 
    </span>
  </h3>
</div>
<script>
  $(document).ready(function(){
    $('[data-toggle="tooltip"]').tooltip(); 
  });
</script>

Upvotes: 5

shrestha_aj
shrestha_aj

Reputation: 336

Do you mean this: https://jsfiddle.net/s294csdn/

<div data-toggle="tooltip" title="This is a tooltip" style="display:inline-block;margin-right:10px;">
  <h3>
    <span class="label label-default">
      Chickens: <span style="color:#fff;">3</span>
    </span>
  </h3>
</div>

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

Upvotes: 0

Related Questions