Tooltips & Popovers

Simple tooltips on buttons, you can use any of the offered classes in the Buttons secction.

<button type="button" class="btn btn-rw btn-default tooltip-active" data-toggle="tooltip" data-placement="left" title="Tooltip on left">Tooltip on left</button>

<button type="button" class="btn btn-rw btn-default tooltip-active" data-toggle="tooltip" data-placement="top" title="Tooltip on top">Tooltip on top</button>

<button type="button" class="btn btn-rw btn-default tooltip-active" data-toggle="tooltip" data-placement="bottom" title="Tooltip on bottom">Tooltip on bottom</button>

<button type="button" class="btn btn-rw btn-default tooltip-active" data-toggle="tooltip" data-placement="right" title="Tooltip on right">Tooltip on right</button>

Morbi dignissim, mi eu vestibulum semper, velit ipsum blandit leo, quis venenatis turpis ipsum eu dolor. Fusce tempus, sapien in vehicula ornare, orci enim ornare leo, tooltip left ligula odio non augue. Nunc libero eros, commodo quis purus ut, interdum condimentum orci. Maecenas consequat venenatis posuere. Pellentesque quam turpis, ultricies tooltip right vehicula viverra non, pharetra tooltip top ullamcorper diam. Donec in nisl sed tellus blandit pellentesque id ut dolor. Nulla sit amet sem scelerisque, facilisis libero et, ultricies tortor. Sed malesuada mattis purus, tooltip bottom at placerat eros aliquam eget. Mauris id suscipit velit, eget dictum est. Aenean faucibus pulvinar erat eget sodales.

<p class="mb15">
	Morbi dignissim, mi eu vestibulum semper, velit ipsum blandit leo, quis venenatis turpis ipsum eu dolor. Fusce tempus, sapien in vehicula ornare, orci enim ornare leo, <a class="tooltip-active" data-toggle="tooltip" data-placement="left" title="Tooltip on left"><b>tooltip left</b></a> ligula odio non augue. Nunc libero eros, commodo quis purus ut, interdum condimentum orci. Maecenas consequat venenatis posuere. Pellentesque quam turpis, ultricies <a class="tooltip-active" data-toggle="tooltip" data-placement="right" title="Tooltip on right"><b>tooltip right</b></a> vehicula viverra non, pharetra <a class="tooltip-active" data-toggle="tooltip" data-placement="top" title="Tooltip on top"><b>tooltip top</b></a> ullamcorper diam. Donec in nisl sed tellus blandit pellentesque id ut dolor. Nulla sit amet sem scelerisque, facilisis libero et, ultricies tortor. Sed malesuada mattis purus, <a class="tooltip-active" data-toggle="tooltip" data-placement="bottom" title="Tooltip on bottom"><b>tooltip bottom</b></a> at placerat eros aliquam eget. Mauris id suscipit velit, eget dictum est. Aenean faucibus pulvinar erat eget sodales.
</p>

<button type="button" class="btn btn-rw btn-default" data-container="body" data-toggle="popover" data-placement="left" data-content="Vivamus sagittis lacus vel augue laoreet rutrum faucibus.">
	Popover on left
</button>

<button type="button" class="btn btn-rw btn-default" data-container="body" data-toggle="popover" data-placement="top" data-content="Vivamus sagittis lacus vel augue laoreet rutrum faucibus.">
	Popover on top
</button>

<button type="button" class="btn btn-rw btn-default" data-container="body" data-toggle="popover" data-placement="bottom" data-content="Vivamus
sagittis lacus vel augue laoreet rutrum faucibus.">
	Popover on bottom
</button>

<button type="button" class="btn btn-rw btn-default" data-container="body" data-toggle="popover" data-placement="right" data-content="Vivamus sagittis lacus vel augue laoreet rutrum faucibus.">
	Popover on right
</button>