Splittext - text re-positioned after split by chars

[mapps-video]

 

 

I have this strange effect when splitting up the text by characters.
The lines get re-positioned which doesn't happen in line split. See screenshot and examples. 

 

Is this a bug or is there a potential fix for it?

 

 

I

See the Pen wbLbPr by klodoma (@klodoma) on CodePen

[PointC]

Looks like character split is running out of bounds by 0.5 pixels. If you set your #content div width to 781 instead of 780, it seems to work correctly. Does that help? Happy tweening.

 

[Visual-Q]

Attempting to force formatting by precisely sizing a container is bound to be problematic, any change or inconsistency between browser rendering could cause reflow. If your goal is to maintain exact line breaks it might be better to force line breaks with a <br> in the text and make the box a little larger than needed to prevent reflow. 

[mapps-video]

54 minutes ago, Visual-Q said:

make the box a little larger than needed to prevent reflow. 

I will give this a shot. 

 

In our case the user sets the box(div) size and position  and also the text within, so those can have any values. 

 

I could on the other side add a "buffer" to make the box larger upon rendering. I'll try and give feedback.