http://granthoneymoon.com/temp.html is the sample page I'm working on.
Any idea why the font styling is not working on my smart phone? It works everywhere else I've tried. But neither bold nor italics work when I look at it on my galaxy 3.
I'm just using font-style and font-weight.
Appearantly, this is somewhat of a known issue with the Samsung S3 devices. There's even a chromium issue regarding it.
You could try visiting the android text test website on your device and see if it displays the font stylings correctly. If it is you should be able to fix your problem by changing the font(s) of the website.
Related
I'm having a problem with a Wordpress based site I'm building on: In Chrome, on Windows 7, the body text on the sites' homepage is set to display as a Google Font. However the last line of the text is displaying as the default sans-serif font.
I have thought about asking about this on Wordpress.org but as the problem is confined to one browser on one OS (albeit the most commonly used browser on the most commonly used OS, natch) thought better to ask here. Have been looking all day and not seen anyone else have the same problem.
It's the latest version of Chrome and there is no problem in IE, Firefox, Opera etc. No problems (as yet...) on any other platforms at all.
There don't appear to be any problems with any other Google Fonts used in the site.
The site is currently hosted at http://best.videofeet.com
Upon inspection of the source there is no apparent reason why it would render like this.
I'm stumped.
Here's a link to an image of the problem (From VirtualBox on Mac - the only means I have available to me to replicate the bug as described by the client): http://imgur.com/XdJlCbc
OK, I'll take a stab at answering this now I've had a tinker. It looks like Josefin Sans does not have a glyph for ellipsis (…), so Chrome is swapping out that line. There are other people experiencing this with other Google fonts:
https://code.google.com/p/googlefontdirectory/issues/detail?id=204
http://wordpress.org/support/topic/a-problem-with-ellipsis-the-google-font-story
The lack of ellipsis can be tested here
Either swap the ellipsis for three periods and risk the wrath of typophiles, or change the font I'm afraid.
Before and after image showing the paragraph tag with the ellipsis removed in developer tools here:
http://i.imgur.com/RmQwlaa.jpg
Me and my colleague have been trying to solve this problem for awhile and we can not get it to work. Hopefully someone out there is smarter than us and have some good input on this.
When using IE8, IE9 or IE10 to visit websites http://glyphicons.com/ or http://getbootstrap.com/components/ not all the glyphicons are showing (some are showing but others just show as boxes []).
In Chrome all are showing.
EDIT: I should add that this is on computers on our company network. Could there be a setting here that prevents us for show all glyphicons?
EDIT2: I now have suspicions that our Group Policy disables XMLHTTP for all users on network. Therefore, is it possible to encode the halfling font and use it directly in the CSS?
I have found the solution. It was quite simple. Unfortunately I won't be able to use Glyphicons.
IE have a setting to restrict font download. This is enabled by group policy and cannot be changed on standard workstations. I have been able to recreate the same behavior on my own laptop by restricting font download.
Se this article for further explanation:
http://msdn.microsoft.com/en-us/library/ms533034(v=vs.85).aspx
To answer your comment olahell, if you count icons you will get 470 icons although it's write 420 with IE8. It's maybe an old forgotten image only shown on old IE version.
It looks like the Glyphicons site does some browser sniffing to come up with the 470 / 420 icon figure. The most likely reason for that is that 50 icons dont work in IE; and that is probably due to IE having no SVG support.
I am having an issue with font sizes in Chrome for Android. These two sites show different font sizes although they are using the same css files and code: link1 and link2.
In all other browsers I have tested, the fonts are displayed identically (Chrome for Windows, IE, Dolphin, Opera). Only Chrome for Android is having the issue?
Does anybody know why??
Chrome for Android has a feature called Font Boosting which on a site that does not have the viewport meta tag will make text that does not read well on the current scale read well.
You can disable font-boosting on a page by setting the max-height on the element that is being boosted to > 100000px. See https://bugs.webkit.org/show_bug.cgi?id=84186#c16 for more details
This might be to do with a known Chrome for Android issue; see here:
http://support.google.com/chrome/bin/static.py?hl=en&page=known_issues.cs
I have developed a site on my MAC. The footer looks good in IE, Firefox, Safari, Chrome but when I look on to a PC it appears that the font is rendering differently and pushing information into the social icons I have placed.
I am using Verdana.
The site is: foodworkscolorado.org/donate
Ideas?
Fonts are going to render differently on any system you test it on. That is life on the web... as it should be. Websites aren't supposed to look identical... they are supposed to display in a variety of formats and ways.
Since you are using a web-safe font, I suspect the issue has to do with the difference between Microsoft's "ClearType" rendering and the anti-aliasing method on a Mac.
The best you can do is test using a service such as http://www.browsershots.org and be aware of the differences.
You may be tempted to use images for your text... don't do this.
Posting here is a bit of a long shot (I can´t reach the developer), but I´m having a problem with a font that I´m embedding using Google web fonts.
The font I´m embedding is Molengo and the problem I have is that the capital Z does not show up in Firefox 4 nor in IE 9. It does show in Chrome 10.
In Firefox 4 the character occupies space and in IE9 it is totally collapsed.
I can reproduce the problem not only on my test site, but also on the official Google web fonts page. At least on my computer the box of the Z does not show the character in Fx4 and IE9 and I don´t have another machine at hand to test on.
Clicking around on Google web fonts, I found the problem at other places as well, like the % character of the Candal font family.
So is my computer just going crazy or is there a problem with random characters from Google web fonts in Fx4 and IE9? And if it is the latter, is there a solution for this problem?
Edit: I just tried generating some Z's using Molengo on Font Squirrel, but they only seem to generate images instead of actual texts.
I have downloaded the same font from Font Squirrel, uploaded it to my own server and included all types like in the demo page and now it shows the Z both in Firefox 4 and IE9.
And all other characters as far as I can tell :-)
Very weird, the problem seems to be related to Google web fonts only.