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

Strange behaviour in paragraphs #144

Open
fvlasie opened this issue May 7, 2021 · 5 comments
Open

Strange behaviour in paragraphs #144

fvlasie opened this issue May 7, 2021 · 5 comments

Comments

@fvlasie
Copy link

fvlasie commented May 7, 2021

Hello, thank you for a wonderful and much needed plugin!
I am seeing some strange behaviour in certain paragraphs of centred text as shown in the screenshot below. It does not have any hidden characters. I am not sure what is triggering the problem as it seems to vary from paragraph to paragraph.
Screenshot 2021-05-06 at 5 09 15 pm

@redmunds
Copy link
Contributor

redmunds commented May 7, 2021

This doesn't give me much to go on. My first suspicion would be a web font that is loading after the original text is balanced and you're not re-balancing after the web font loads.

Be sure to read through all of the existing open (and possibly closed) Issues to see if you get any ideas to help you solve problem.

For the best help, you'll need to create the simplest local file that reproduces the problem, post the file somewhere and provide a link.

@fvlasie
Copy link
Author

fvlasie commented May 7, 2021

balance.zip

@fvlasie
Copy link
Author

fvlasie commented May 7, 2021

Thanks for your response! I have written a sample html file that shows the problem (in the comment above, zipped because GitHub doesn't like html). It does seem somehow related to webfonts.

@redmunds
Copy link
Contributor

redmunds commented May 7, 2021

I played around with it and don't think there's much that can be done to fix this case.

This code was designed to balance text for cases with just a few lines like h1-6 tags, caption tags, label tags, or blockquote or p tags with a small amount of text. This plugin is to illustrate the idea in hopes of getting this into CSS Text module.

As you have discovered, the algorithm starts to fall apart with more than about 6-7 lines of text, especially with narrow containers. Your example has 11 lines in a 218px container. My suggestion is to widen the container, or do not apply balance-text when string exceeds a certain length.

I will leave this Issue open as a reminder to improve the algorithm at some point, but I don't do much web front-end work these days, so I probably will not get to it any time soon. Also, the benefit of using this algorithm diminishes as the number of lines increases, so not sure if it's worth the effort.

Thanks for using plugin and reporting bugs!

@fvlasie
Copy link
Author

fvlasie commented May 7, 2021

I understand. Thank you for taking the time to look into this. For long paragraphs it really isn't such a big deal....

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

2 participants