Add line break to tooltip in Bootstrap 3

眉间皱痕 提交于 2019-11-27 11:45:31

You need to add data-html="true" to the markup..

<div class="content show-tooltip" data-html="true" data-placement="top" 
     title="1st line of text <br> 2nd line of text">

Working demo: http://www.bootply.com/83099

In the Title use this code to break the line:

HTML

...title="- Item 1 &#013; - Item 2 &#013;"

CSS

.ui-tooltip {
    /* tooltip container box */
    white-space: pre-line;
}

.ui-tooltip-content {
    /* tooltip content */
    white-space: pre-line;
}
易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!