Tagliavia Posted November 12, 2021 Share Posted November 12, 2021 Hi everyone I have some text that comes from i18n and has \n to break the text in different lines. When using split text it is all appearing in a single line. Any work around would be kindly appreciated Link to comment Share on other sites More sharing options...
PointC Posted November 12, 2021 Share Posted November 12, 2021 Have you tried this in your CSS? white-space: pre-line 1 Link to comment Share on other sites More sharing options...
Tagliavia Posted November 12, 2021 Author Share Posted November 12, 2021 Thanks for the reply sir, yes in fact that what i find odd the whitespace pre-line is present Link to comment Share on other sites More sharing options...
PointC Posted November 12, 2021 Share Posted November 12, 2021 hmmm... I just did a little test. It seems innerText adds the <br> tags for you while innerHTML needs the CSS pre-line. All looks correct until I go to split the text and then the lines don't seem to work on the innerHTML version. I don't know if this is the intended behavior or not. Maybe @GreenSock can offer some more details. Until then, innerText seems to work just fine. See the Pen 90742f069e3137f50676319a4a3517d8 by PointC (@PointC) on CodePen Link to comment Share on other sites More sharing options...
Tagliavia Posted November 12, 2021 Author Share Posted November 12, 2021 Thanks lets see if we can get more info about it. Link to comment Share on other sites More sharing options...
Solution GreenSock Posted November 13, 2021 Solution Share Posted November 13, 2021 9 hours ago, PointC said: hmmm... I just did a little test. It seems innerText adds the <br> tags for you while innerHTML needs the CSS pre-line. All looks correct until I go to split the text and then the lines don't seem to work on the innerHTML version. I don't know if this is the intended behavior or not. Maybe @GreenSock can offer some more details. Until then, innerText seems to work just fine. Yes, SplitText isn't intended to support that since there are plenty of line breaks in HTML that shouldn't be interpreted as <br>, but since SplitText does respect <br> tags you can do a simple replace before splitting (if you don't want to use innerText, which is probably the cleanest solution): See the Pen 0661f541dfd3eec8c0f9b01c1d902b0f?editors=0010 by GreenSock (@GreenSock) on CodePen 1 Link to comment Share on other sites More sharing options...
PointC Posted November 13, 2021 Share Posted November 13, 2021 Well there you go @Tagliavia. You can use a replace or maybe innerText so the replace is automatic. Happy splitting. 1 Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now