Hint.css Manual Line Break In Hint

How can I apply manual line breaks in Hint.css hints? I tried almost everything: , \n, and combinations of them. I tried also some things in the CSS: white-space: normal;

Solution 1:

Found the answer at:

https://github.com/chinchang/hint.css/issues/24

In action:

[http://jsfiddle.net/gVPty/][2]

Solution 2:

I was struggling with this today and came across this answer so I'm posting my solution:

I needed the tooltip to automatically break the line - because some tooltips I couldn't control the content. So the solution was adding the "line-breaker" properties to the tooltip element:

```

[class*=hint--]:after {
    min-width: 300px;
    white-space: pre-wrap;
    word-break: break-all;
}

```

The min-width is set so when you have a string like "aaaaaaaaaaaaaaaaaaaaaaaa" it doesn't break all the the "a"s into new lines without considering a min-width. Here is an example: http://plnkr.co/edit/CfTCxaqPxd1K2Jx5P7nc

Solution 3:

Im using v2.3.1 and had to add this CSS to make the line breaks work:

[class*=hint--][aria-label]:after {
  white-space: pre;
}

Im using 
 as the line break character.