0

My pictos icons are working fine in desktop browsers, but not rendering on ios.

head

<link href="//get.pictos.cc/fonts/1895/1" rel="stylesheet" type="text/css">

header link HTML

<a href="/" alt="Home" class="" rel="tooltip" title="Home"><span aria-hidden="true" data-icon="H"></span></a>

Pictos CSS

[data-icon]:before {
font-family: 'Pictos Custom';
content: attr(data-icon);
-webkit-font-smoothing: antialiased;
}

Pictos icons in chrome Pictos icons chrome

Pictos icons in iOS Pictos icons iOS

colmtuite
  • 4,311
  • 11
  • 45
  • 67
  • 2
    Probably is because iOS did not have `'Pictos Custom'` font, you need to import it with CSS. – Fong-Wan Chau Jun 09 '12 at 15:37
  • I forgot to mention I'm importing the font with CSS link in the head. – colmtuite Jun 09 '12 at 15:43
  • I can't access pictos CSS because I don't have an account on it, but there have a question about this that you might interest: http://stackoverflow.com/questions/4058342/using-css-font-face-with-the-ipad-iphone – Fong-Wan Chau Jun 09 '12 at 16:02
  • You can export "Pictos" font in .otf format from photoshop. Pictos font is available in photoshop. – Gaurav Borole Sep 11 '14 at 08:09

0 Answers0