George Alex Posted March 1 Share Posted March 1 Hey, guys. Can you help me understand why my text twitches when it changes? I've racked my brain, but I don't understand what I need to do to achieve a seamless animation. Here is a prime example of what I need. This guy's animation is very smooth. Just hover over the links in the menu https://www.chaingpt.org/ See the Pen OJGJeGL by GeorgeDesign2020 (@GeorgeDesign2020) on CodePen Link to comment Share on other sites More sharing options...
Solution ryan_labar Posted March 1 Solution Share Posted March 1 Most fonts have different widths for each character, which will cause the text to change widths as the characters change. A Monospace typeface will is the easiest fix for this: most font libraries have a filter for this if you need something more custom, but you can use your system's default by this to your CSS: font-family: monospace; 1 Link to comment Share on other sites More sharing options...
George Alex Posted March 1 Author Share Posted March 1 45 minutes ago, ryan_labar said: Most fonts have different widths for each character, which will cause the text to change widths as the characters change. A Monospace typeface will is the easiest fix for this: most font libraries have a filter for this if you need something more custom, but you can use your system's default by this to your CSS: font-family: monospace; I'll give it a try. Thanks) Link to comment Share on other sites More sharing options...
Rodrigo Posted March 1 Share Posted March 1 Hi, Ryan is right, if you inspect that site you'll see this as the font family for those elements: font-family: Roboto Mono,sans-serif; Another option is to give your link elements a fixed width, that would avoid the problem as well. Happy Tweening! 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