Custom Font causes weird UI Bugs

I defined a font using @font-face and changed the Application font by using

.v-app {
font-family: “FontFamilyName”;

It works. The problem is that when I close the browser, or close the tab, and open again, all the layout components change a little their positions, they get close together, or some other weird experiences like not showing the field entirely, but a little bit cut in the borders …

It looks like the application can render well all UI Components, but, if you store the application in cache, meaning, when you re open the Application, since it already has in cache, it justs renders everything it had, and that is causing the problems. (Thats just a theory :smiley: )

If I perform an language change (that would re setValue or Caption on all Components) the components go back to their normal places.

I will see if I can post some pictures later, but I would appreciate any insight.

Thank you.

doesnt anyone ever experienced something like that?

does vaadin support this @font-face on CSS?