Add line break within tooltips

How can line breaks be added within a HTML tooltip?

I tried using <br/> and \n within the tooltip as follows:

<a href="#" title="Some long text <br/> Second line text \n Third line text">Hover me</a>

However, this was useless and I could see the literal text <br/> and \n within the tooltip. Any suggestions will be helpful.


Just use the entity code &#013; for a linebreak in a title attribute.


Just add a data attribute

data-html="true"

and you're good to go.

Eg. usage:

<i data-html="true" class="tooltip ficon-help-icon" twipsy-content-set="true" data-original-title= "<b>Hello</b> Stackoverflow"> </i>

It has worked in majority of the tooltip plugins i have tried as of now.


The &#013; combined with the style white-space: pre-line; worked for me.


This CSS is what finally worked for me in conjunction with a linefeed in my editor:

.tooltip-inner {
    white-space: pre-wrap;
}

Found here: How to make Twitter bootstrap tooltips have multiple lines?


\n

with the styling

.tooltip-inner {
    white-space: pre-line;
}

worked for me.