Font Family not applied on mobile

Viewed 30

I hav defined the font-family in the body tag in css. When inspected, the mobile view seems to work but when hosted and opened in a mobile it's not workin

CSS Code:

body{
    margin: 0;
    font-family: Georgia, 'Times New Roman', Times, serif !important;
}


Inspect, mobile view Inspect Mobile View

Real MobileReal Mobile

1 Answers

Font Family must exist on device to be used. Your PC has that font, while Mobile does not.

You can always add fonts sources from Google Fonts, fontsquirrel or embedded from own source:

@font-face {
  font-family: 'FooBar';
  font-style: normal;
  font-weight: 100;
  font-display: swap;
  src: url(/fonts/FooBar.woff2) format('woff2');
}

Georgia is not free font, that's why it's not on any open-source fonts platform.

Related