Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Is there a way to add new line in the hint? #24

Closed
nikolas6 opened this issue Mar 8, 2013 · 7 comments
Closed

Is there a way to add new line in the hint? #24

nikolas6 opened this issue Mar 8, 2013 · 7 comments

Comments

@nikolas6
Copy link

nikolas6 commented Mar 8, 2013

The hint looks awesome. I can't seem to find a way or instruction to add new line on the hint. Is there a way to add new line in this version?

Thank you.

@brandonkm
Copy link

If the white-space property on the attribute pseudo element has a value of pre then you can use the HTML new line entity 
 to add new lines.

Example: http://jsfiddle.net/gVPty/

@nikolas6
Copy link
Author

That works! Thanks a lot brandonkm

@cincodenada
Copy link

A quick note for those finding this from Google: if you're using jQuery to set the attr, it will destroy the 
. To get around it, you can use \u000A instead, which is the same thing just in unicode, and attr() doesn't mangle it.

@Grajon
Copy link

Grajon commented Dec 12, 2013

with 1.3.x version 
 and \u000A do not work
help me please to have new line in hint working again !

@nikolas6
Copy link
Author

Still work for me. As what @brandonkm mentioned, set white-space to pre. Then use &#10 to add new lines.

http://jsfiddle.net/2JfJQ/

@Grajon
Copy link

Grajon commented Dec 13, 2013

yes it's work for me too, but you must choose beetwen multiline and new lines as @brandonkm says in issue #61

@Programm3r
Copy link

The following works for me (as stated above)

    .hint:after, [data-hint]:after {
        white-space: pre;
    }
<span class="hint--rounded hint--bounce hint--top" data-hint="line 1 &#10;line 2 &#10;line 3">
       this is some random value
 </span> 

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

5 participants