-webkit-pictograph not working on safari - css

I employed font -webkit-pictograph;
It displays good on chrome and opera browser,
but as for safari,
It return little helpful info when search -webkit-pictograph safari.

Try to clean cache in browser.
If you open the dev console and see what files the browser is pulling from your site, you'll be able to see if it's downloading the font file in Safari.

Related

my site showing up in chrome and firefox but not in safari and edge

My current project is showing up nicely in chrome and firefox browsers but does not showing up in safari and internet explorer browsers. Here is the link for my site, http://www.grahamkellyphotography.com/landscape-photography-ireland/blog/
The issue is totally killing me as same site is working fine on other browsers but not working in safari and internet browsers.
Looks like a .js issue or conflict.
Which theme are you using? Is the theme working in safari and IE in the original theme demo?

Custom font not loaded properly in Firefox

I'm trying to use custom font for my client live website. The font is working properly in Chrome, Safari, Opera as well as in IE but not working in Firefox.I follow the Manuel solution that works fine but when I see the firefox network log it show that loaded font size is only 0KB. If I directly open the font link it start downloading font with it's original size.

Why does my Agency FB font work fine with Firefox and Chrome but not in IE. www.serialquilting.com

Basically the #font-face is working fine in Chrome and Firefox but not working properly in Internet Explorer. If someone could take a look at it www.serialquilting.com and advise what the issue might be that would be great.
Yes, this is likely because Internet Explorer needs a different font format. There's a great tool for this:
Font Converter
Internet Explorer will work nicely with Embedded OpenType (EOT), and Open Font (OFT)

css font family : Why some font doesn't render on mobile

Does any one know why some of my font families won't render on some mobile devices? Here's a page that demonstrates the fonts:
http://jl.evermight.com/font/
The fonts render properly on desktop chrome browser, ipad and iphone.
But when i view that page on my galaxy note, the Have A Nice Day font renders as something that looks like arial. On my friends nexus 4, Have a nice day works fine, but the universe condense renders as something that looks like arial.
Does anyone know why?
I've attached screenshot of what the fonts should look like
Additional notes
some people claim Have a nice day is not working in Firefox or IE10. For me, the font works on Firefox. I don't have IE10, so unable to verify.
How do I make this font work on my android?
Additional Notes
I had a typing mistake in my link path to my css files. I've corrected it now. But the problem still appears in my droid browser.
Just tried out the link on my phone - HTC 8s, everything seemed to work fine. Below is the screenshot for the same.
ON HTC 8S
ON IE 10
It's possible it's a downloading issue. The fonts listed in your declaration should work across most browsers (just make sure you're not in Opera Mini, it doesn't really support much of anything).
Additionally, Have a Nice Day is loaded through #font-face declarations in the CSS file, but the others appear to be loaded from the JavaScript, which might be part of the issue. Droid Sans is on Android phones by default, so they're likely just pulling them locally, which is why they work across the board on Android. From there, it might be a difference of JavaScript support (if Universe doesn't work, JS isn't turned on, for example).
Another thing that might help is opening up developer tools in a desktop browser that isn't working (in the case of Firefox, you'll want to pick up the Firebug extension). Check the "Net" or "Network" tab and see if your font files are getting downloaded.
If that still doesn't work, try playing around with the order of the font files in the declaration. I've seen browsers take issue with the order.
Also, the Droid Serif fonts are available from Google Web Fonts, which works cross browser with little headache. It might be worth seeing if your other fonts (or something close) are there, too, and just use Google's Web Font Loader to load your fonts.
The problem has been fixed. Apparently there was a bug on myfonts.com that corrupted my font files. I contacted myfonts.com and they corrected the issue right away. Then re-sent me the font files. Now everything works perfectly.
The guys at myfonts.com are amazing. Very good customer + tech support services.
Below is a link to how I do my #fontfaces for cross browser compatibility.
Cross Browser Fontface

Large bold(er) text in IE

I'm working on a tag-could style menu on a website: http://web12.leankursus.dk/
It works in chrome, (currently) has some minor problems in firefox and some larger problems in IE (9). The main problems seems to be that IE doesn't make the font as bold as Firefox and Chrome. The font need to look like it does in FF or Chrome, but I am unsure what you do when the browser just displays it diffrently
Hope you can help me.
EDIT: Screenshot of the page in IE9 and Chrome: http://i.imgur.com/1fgwX.jpg
EDIT2: Ah! I've realized I was running IE9 in compatibility mode. Turning that off fixes it in IE9. However - is there any way to make the font work in at least IE8 ?
IE8 and lower don't support .ttf files for the #font-face clause. Use .eot files for IE.
There are some problems with getting it to work in different browsers simultaneously though. Read, for instance, this.
http://readableweb.com/mo-bulletproofer-font-face-css-syntax/

Resources