Font doesn't italic on canvas
Hi all! I'm a web developer. I'm making a web for making infographic by canvas. But I have a problem about render italic on Firefox Here is my test page http://jsfiddle.net/suongphanthanh/79arnomz/ You can see the custom font from google and It doesn't render as italic. Other default font is working. Can somebody help me? Thanks for every ideas!
All Replies (5)
The result appears to render in italics on my end.
Try Firefox Safe Mode to see if the problem goes away. Firefox Safe Mode is a troubleshooting mode that temporarily turns off hardware acceleration, resets some settings, and disables add-ons (extensions and themes).
If Firefox is open, you can restart in Firefox Safe Mode from the Help menu:
- Click the menu button
, click Help 
and select Restart with Add-ons Disabled.
If Firefox is not running, you can start Firefox in Safe Mode as follows:
- On Windows: Hold the Shift key when you open the Firefox desktop or Start menu shortcut.
- On Mac: Hold the option key while starting Firefox.
- On Linux: Quit Firefox, go to your Terminal and run firefox -safe-mode
(you may need to specify the Firefox installation path e.g. /usr/lib/firefox)
When the Firefox Safe Mode window appears, select "Start in Safe Mode".
If the issue is not present in Firefox Safe Mode, your problem is probably caused by an extension, theme, or hardware acceleration. Please follow the steps in the Troubleshoot extensions, themes and hardware acceleration issues to solve common Firefox problems article to find the cause.
To exit Firefox Safe Mode, just close Firefox and wait a few seconds before opening Firefox for normal use again.
When you figure out what's causing your issues, please let us know. It might help others with the same problem.
From what I can see, that particular font doesn't have an italic style:
- The CSS file only defines the normal style: http://fonts.googleapis.com/css?family=Vast+Shadow
- Google's demo page shows no italic: http://typecast.com/preview/google/Vast%20Shadow
Firefox sometimes substitutes a different font face to cover missing styles, but not for this one for some reason.
Wesley Branton said
The result appears to render in italics on my end. Try Firefox Safe Mode to see if the problem goes away. Firefox Safe Mode is a troubleshooting mode that temporarily turns off hardware acceleration, resets some settings, and disables add-ons (extensions and themes). If Firefox is open, you can restart in Firefox Safe Mode from the Help menu:If Firefox is not running, you can start Firefox in Safe Mode as follows:
- Click the menu button
When the Firefox Safe Mode window appears, select "Start in Safe Mode".
- On Windows: Hold the Shift key when you open the Firefox desktop or Start menu shortcut.
- On Mac: Hold the option key while starting Firefox.
- On Linux: Quit Firefox, go to your Terminal and run firefox -safe-mode
(you may need to specify the Firefox installation path e.g. /usr/lib/firefox)If the issue is not present in Firefox Safe Mode, your problem is probably caused by an extension, theme, or hardware acceleration. Please follow the steps in the Troubleshoot extensions, themes and hardware acceleration issues to solve common Firefox problems article to find the cause. To exit Firefox Safe Mode, just close Firefox and wait a few seconds before opening Firefox for normal use again. When you figure out what's causing your issues, please let us know. It might help others with the same problem.
Thanks for your idea. I got it. I found out it come from firefox theme. But I'm making a website and I cannot ask my users switch to safe mode everytime they access my website. jscher2000 said
From what I can see, that particular font doesn't have an italic style:
- The CSS file only defines the normal style: http://fonts.googleapis.com/css?family=Vast+Shadow
Firefox sometimes substitutes a different font face to cover missing styles, but not for this one for some reason.
- Google's demo page shows no italic: http://typecast.com/preview/google/Vast%20Shadow
But I it's working on other browser and Firefox safe mode!
Thanks a lots for coming with me!
Modified by suongphanthanh
Hmm, yes, it works in Firefox's Safe Mode. Or in regular mode with hardware acceleration disabled. So it's something about hardware acceleration, but I have no idea what.
I assume that this is a font issue and Firefox selects the font from the available variants in this font-family.
- Bug 644385 - Arial Narrow, Arial Black fonts do not show on page (comment 8)
When DirectWrite rendering is used rather than GDI rendering, font families are grouped differently How a browser reacts here will depend on which font subsystem it's using. Windows has two different font subsystems: GDI and DirectWrite.