hint.css
hint.css copied to clipboard
Line break
Hello !
Cannot use <br>
or a \r\n line breaks.
Thank you.
You can use this trick: http://stackoverflow.com/a/16452853
Thanks vsxed ! For anyone else coming along, this means that you just have to add this to your hint.css :
[data-hint]:after {
content: attr(data-hint);
white-space: pre;
}
and use this entity for linebreaks :


FYI, starting v2.2.0, there are 3 size variations available: hint--small
, hint--medium
& hint--large
. This should help make the situation better where long texts break out instead of spanning across multiple lines.
For others who're struggling witht his: Im using v2.3.1 and had to use this CSS to make the line breaks work:
[class*=hint--][aria-label]:after {
white-space: pre;
}
Neat plugin BTW :)
If you want to also auto wrap on long lines you should use pre-line
instead
So you content won`t run off the container
[class*=hint--][aria-label]:after {
white-space: pre-line;
}
Awesome job guys - working in 2.4.0
To save time for others in case it isn't clear, the solution, evolved down to the nakashu jul25 post is for embedded '\n' to work, not the '
'
in the lavenpillay post.
Any chance to have this CSS modification included in hint.css?
Try this
Any chance to have this CSS modification included in hint.css?
Will add! nice suggestion!