Tooltips

Hover over the links below to see tooltips:

Phasellus molestie magna non est bibendum non venenatis nisl tempor. Suspendisse dictum feugiat nisl ut dapibus. Mauris iaculis porttitor posuere. Praesent id metus massa, ut blandit odio. Proin quis tortor orci. Etiam at risus et justo dignissim congue. Donec congue lacinia dui, a porttitor lectus condimentum laoreet.

Tooltips can be set in 4 directions

Tooltip on Top   |   Tooltip on Bottom   |   Tooltip on Right   |   Tooltip on Left

Labels

Default Primary Success Info Warning Danger

                Add any of the below mentioned modifier classes to change the appearance of a label.

                <h2>Example heading <span class="label label-default">New</span></h2>
                <h3>Example heading <span class="label label-primary">New</span></h3>
                <h4>Example heading <span class="label label-warning">New</span></h4>
                <h5>Example heading <span class="label label-info">New</span></h5>
                <h6>Example heading <span class="label label-danger">New</span></h6>

                You can even make them smaller:

                <h4>Example heading label-sm <span class="label label-info label-sm">New</span></h4>
                <h4>Example heading label-xs <span class="label label-warning label-xs">NEW</span></h4>

                <div class="tf_divider divider_space_thin "></div>

Alert messages

                Provide contextual feedback messages for typical user actions with the handful of available and flexible alert messages with <code>dismiss functionality</code>.