Muhsin Keloth
Muhsin Keloth

Reputation: 7964

Custom font is not working in device

I have developed an android mobile application using the Ionic framework.I have used custom font Lato-Black by refering this blog.However it doesn't work on devices. In Chrome/Firefox,works well.

style.css

.text-font-white {
    color: white;
    margin-bottom: 0;
    font-family: 'Lato-Black';
}
@font-face {
    @font-face {
        font-family: 'Lato-Black';
        src: url('../fonts/fontawesome-webfont.ttf') format('truetype');
        font-weight: normal;
        font-style: normal;
    }
}

HTML

<h1 class="text-font-white">Welcome</h1>

Upvotes: 0

Views: 1434

Answers (1)

Pranav C Balan
Pranav C Balan

Reputation: 115282

Your CSS syntax is not correct, there is nested occurrence of @font-face in your code

.text-font-white {
  color: white;
  margin-bottom: 0;
  font-family: 'Lato-Black';
}
@font-face {
  font-family: 'Lato-Black';
  src: url('../fonts/fontawesome-webfont.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
}  

Upvotes: 1

Related Questions