Jump to content
GreenSock

Search In
  • More options...
Find results that contain...
Find results in...
ilovemypixels

reduceWhiteSpace : false not working

Warning: Please note

This thread was started before GSAP 3 was released. Some information, especially the syntax, may be out of date for GSAP 3. Please see the GSAP 3 migration guide and release notes for more information about how to update the code to GSAP 3's syntax. 

Recommended Posts

Hi there,

 

I am having an issue with reduceWhiteSpace:false on splitText. It doesn't seem to be doing anything for spaces and or  
I have a font where placing a Y character next to another letter, with a space, it looks like there is no space between them. So I need to artificially add some space.
I tried adding a span with margin but I was getting issues on some browsers so I need this reduceWhitespace to work.

 

Thanks for your help

 

Will

See the Pen VJReXd by ilovemypixels (@ilovemypixels) on CodePen

Link to comment
Share on other sites

Try splitting it into words...

 

type: "words,lines"

 

and if needed, chars.

 

type: "chars,words,lines"

 

  • Like 1
Link to comment
Share on other sites

It still doesn't really work properly. This only makes a small space.
 

30% OF        &nbsp;YOUR<br>

 

space_error.jpg

Link to comment
Share on other sites

4 minutes ago, iloveaphextwin said:

It still doesn't really work properly. This only makes a small space.

 

It looks exactly like your original text. At least in Chrome. I didn't check other browsers.

 

See the Pen JQzXVQ by osublake (@osublake) on CodePen

 

 

Link to comment
Share on other sites

Thanks for your help but I'm just getting confused now.

What I am saying is that in the HTML above i have a good 20 spaces and one &nbsp; I would expect the word "YOUR" to be halfway across the page. However its only shifted a little bit to the right, and indeed without the &nbsp; there is almost no extra gap beyond one single space. So to me it looks like reduceWhiteSpace false is not working, in that it is still reducing white space?

Link to comment
Share on other sites

My demo shows that the browser is collapsing your white space. The text inside the copy_2 div isn't being split apart by GSAP.

 

If you want spaces, then use &nbsp;

 

See the Pen OeqXaZ by osublake (@osublake) on CodePen

 

 

  • Like 4
Link to comment
Share on other sites

Ok thank you very much.

I assumed reduceWhiteSpace would avoid this browser issue but I guess its just for managing how splitText actually splits text.

thanks again

Link to comment
Share on other sites

Yeah, there's no way to avoid that as the browser does it automatically.

  • Like 2
Link to comment
Share on other sites

I tried the span option first, but for some reason on Chrome sometimes the page would load with a couple of extra line breaks.

Link to comment
Share on other sites

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 account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    • No registered users viewing this page.
×