Figma Support Forum

Texts are either moving by 1px to the left or the font is getting larger/thicker

Below is what my interactive component looks like. It’s set from default to hover. All it does is just add a line (a rectangle) underneath and changes the font color to black from grey. When I remove it out of the interactive component and do it manually before this before version. It works perfect. But once I use the interactive component feature, on hover it moves a bit. Really slight but it bothers me. It’s weird because it only does that for 1 out of 3 of the links that I have.

Ex) Link 1 (navigates to another page once clicked on), Link 2 (navigates to another page once clicked on), Link 3 (opens an external link)
Link 1 & 2 interactive components work fine. But Link 3 has the weirdness to it. It doesn’t stay in the same place.

It is hard to say with the information you are providing, but I will attempt something.

If the line you have below your text is hidden and then shows on hover… like not just opacity 0% but completely hidden, then that’s your issue. Try removing colour instead of hiding it.

If that is not your problem, please share your link, I’ll take a look for you.

Hope that helps!

It is hidden. Not 0%. I tried just right now if it was 0%, but it’s still doing the same thing.

I don’t think that’s the issue because like mentioned above, Link 1 & 2 are working perfectly fine. But Link 3 is where it’s messing up.

So I didn’t want to share my file, so I made a duplicate one. I don’t have anything linked at all. Just the hover interaction. And now it’s weird because Link A is the one that’s not working correctly. But the rest are.

What’s odd is that if I use 100% view then it works perfectly. All 3 of them. But if I use the “Width – Scale down to fit width” then Link A doesn’t work perfectly. That also holds true with my original file with Link 3. Link 3 doesn’t work well on Width, but does work well on 100% view.

image

Update: I’m not sure what’s going on but I can’t seem the replicate the error anymore.

It’s still happening on my original file though. Is there a way for me to privately message over my link?