A tool for your tip

Tooltips are a very useful component for describing in detail an element or a web page. For example, when you have an image and want to describe it further, you add a tooltip. When users hover over the image, they see further information.

In our case, we will use tooltips for the buttons present in every tweet, such as Reply, Retweet, and Start. This Bootstrap plugin component is pretty simple and useful in many cases. To start it, just add the markup in bold to the tweets in the middle column (<li> in the ul#feed element):

<ul id="feed" class="list-unstyled">
  <li>
    <img src="imgs/doge.jpg" class="feed-avatar img-circle">
    <div class="feed-post">
      <h5>Doge <small>@dogeoficial - 3h</small></h5>
      <p>You can't hold a dog down without staying down with him!</p>
    </div>
    <div class="action-list">
      <a href="#" data-toggle="tooltip" data-placement="bottom" title="Reply...