Besufekad Tamiru
Besufekad Tamiru

Reputation: 126

Is there a way to wrap a scaled up text when it overflows div width via css

So my problem is I have this hover effect applied on a text which should change the font size of the text. At first I used font-size transition by enlarging the font size while being hovered. Transitioning the font-size works perfectly as it wraps the texts when it overflows the parent div. The only negative using font-size transition is, it has this annoying jitters as it grows. So I chose to use transform scale as this has a more appealing transition.In other words, I scale up the text when hovered. However, using this solution, I can't wrap the text when it overflows the parent div. Which made me to switch back to my former solution (Font size transition). I am trying to figure how to best approach this issue

Upvotes: 1

Views: 180

Answers (1)

Abdulrahman Ali
Abdulrahman Ali

Reputation: 615

Try to add this CSS property will-change: transform; to the selector that performs the scale transformation. It will help the browser to anticipate the jitteriness problem associated with the transform animation. More info on MDN

Upvotes: 1

Related Questions