Random custom font rendering issue with interactive IOS Webview

I've tried every trick in the book I know. But when I quickly switch from one web browser to another, the custom font gets lost and no longer appears.

I have a font inside my own code and a @ font-face fallback on the css part:

Writing with XCode:

Nea: (
    "Nea-Bold",
    "Nea-Regular"
)

      

From css file:

$PLANET-FONT-FAMILY-BLACK: "Nea-Bold", "Nea Bold", "neaboldwebfont", "Avenir LT Std 85 Heavy", "Arial";
$PLANET-FONT-FAMILY-BOOK: "Nea-Regular", "Nea Regular", "nearegularwebfont", "Avenir LT Std 85 Roman", "Arial";

/* Fonts */

@font-face {
  font-family: 'Nea Bold';
  font-style: normal;
  font-weight: normal;
  src: url("../../../../../assets/fonts/nea/nea-bold-webfont.svg#neabold") format("svg"),
  url("../../../../../assets/fonts/nea/nea-bold-webfont.ttf") format("truetype"),
  url("../../../../../assets/fonts/nea/nea-bold-webfont.eot") format("opentype"),
  url("../../../../../assets/fonts/nea/nea-bold-webfont.woff") format("woff");
}

@font-face {
  font-family: 'Nea Regular';
  font-style: normal;
  font-weight: normal;
  src: url("../../../../../assets/fonts/nea/nea-regular-webfont.svg#nearegular") format("svg"),
  url("../../../../../assets/fonts/nea/nea-regular-webfont.ttf") format("truetype"),
  url("../../../../../assets/fonts/nea/nea-regular-webfont.eot") format("opentype"),
  url("../../../../../assets/fonts/nea/nea-regular-webfont.woff") format("woff");
}

      

It works most of the time unless I reload the webview too quickly. What am I doing wrong?

+3


source to share





All Articles