No font on safari and mobile
Answered
Red imported fire ant posted this in #help-forum
Red imported fire antOP
Hi!
I tried to link a google font(Inter)
I layout.tsx set as
import { Inter } from 'next/font/google';
const inter = Inter({
subsets: ['latin', 'cyrillic'],
});
...
<html lang='en' className={inter.className}>
On Chrome, Arc, FireFox everything is ok, but in Safari and mobile browesers i got default font.
How to fix it?
I tried to link a google font(Inter)
I layout.tsx set as
import { Inter } from 'next/font/google';
const inter = Inter({
subsets: ['latin', 'cyrillic'],
});
...
<html lang='en' className={inter.className}>
On Chrome, Arc, FireFox everything is ok, but in Safari and mobile browesers i got default font.
How to fix it?
Answered by Red imported fire ant
fixed:
changed inter.class...
to
html lang='en' className={
changed inter.class...
to
html lang='en' className={
${inter.variable}}>6 Replies
Red imported fire antOP
here is how i added font in layout.tsx
Red imported fire antOP

Red imported fire antOP
in inspector i see links to font, but they didn't apply to css
Red imported fire antOP
so, got this error..
Red imported fire antOP
someone know how to fix it?...
Red imported fire antOP
fixed:
changed inter.class...
to
html lang='en' className={
changed inter.class...
to
html lang='en' className={
${inter.variable}}>Answer