I am working on a site where I am having a font issue. The font shows up correctly for all browsers on a PC, but, the issue is when it is viewed with Chrome on a Mac. I know how to do hacks for specific browsers, but, I am at a loss when it comes to Chrome on a Mac. How do you specify for a particular browser on a Mac. I've attached screen captures. Any suggestions on how to fix this? Thank you in advanced for your time and consideration.
Correct Chrome on PC
incorrect Chrome on Mac
I ran into a problem with font rendering on Windows.
I'm used to a little difference in rendering between Mac and Windows, but this just made my mouth fall open. I tested the site thoroughly on Mac and I'm positive it looks just fine in Chrome, Firefox and Safari.
It looks like this on Mac browsers:
On Windows, it looks completely messed up in any browser (I tested Chrome, Firefox and IE):
I know Mac has Iowan Old Style installed by default, so I tried forcing the Mac browsers to use the webfont I generated using FontSquirrel, but that doesn't reproduce the problem on Mac.
Both browsers seem to load the same font (namely the woff version) correctly. Does anybody have any idea what this could be?
I can't post the link to the website because I don't have enough reputation, please look at the screenshots for the URL..
Thanks guys!
After some more research I found out the original (ttf) font worked perfectly fine on Windows, so it had to be FontSquirrel that caused the problems. I tried out 8 different types of settings on FontSquirrel and kept having the same issues.
After a while I decided to try a different generator and I came across Fontie: https://fontie.flowyapps.com/home
This actually solved the problem for me!
I've been having a weird web fonts related problem with Firefox only.
To put it short, web fonts are not loading at all from Google or Typekit. This is also the case if I just browse to http://www.google.com/fonts or https://typekit.com/fonts
Here's how Firefox behaves on both sites:
I checked Typekit help regarding this type of issue. All the mentioned settings were correct. Also removed and re-installed Firefox. Tried to connect through 3 different network connections. Nothing seem to help.
I'm sure it's some very basic Firefox setting or problem, but I just can't figure out what. Anyone had similar issues? Any solutions?
Windows 7 Enterprise (32-bit), Firefox 34.0.5.
No problems with latest Chrome, IE 11 or latest Safari.
This is issue of Google web fonts not rendered
i think Mozilla support will help you, there is same issue and it solution also visite mozilla support forum
This is bug that can be found here
I have created a couple of apps to show on my companies facebook page. I have tested every browser on my mac and everything is working as its supposed to. However, it will not work on any browser on a Windows machine. I have inputted both the page tab url as well as the secure page tab url so I am confused as to why it will not show up on a PC.
Here is think to one of my page tabs:
https://www.facebook.com/pages/Atria-Senior-Living/208728162501220?id=208728162501220&sk=app_131012823749816
I have searched all over and cant find any solutions to this problem.
Any help would be appreciated.
Thanks
I have figured out what was going on. I did not have "www" listed after "https://". For whatever reason the Windows machine did not like that.
What are the differences from a developer point of view between Safari for Mac and Safari for Windows?
I think it boils down to evaluate differences between (if I missed something, please correct):
- Layout rendering
- Javascript behavior
The final decision to be made being:
Can developers test only on Safari Windows (knowing that we can't afford to miss important bugs)?
Thanks,
JB
As far as rendering and JavaScript are concerned, there is no difference. What is different is underlaying UI library used for browser itself, but page render is the same.
Font rendering can be different between Mac and Windows Safari as the systems typically have different fonts. As long as your page can gracefully handle missing fonts or different font sizes it should be fine.
Style sheet rendering is significantly different between Safari and Windows. To see this, try creating a page that has an element with a z-index of -1. The windows version will function without issue, the Mac version will not allow you to select the elements. Trust me, I wasted about three hours trying to figure out by trial and error why a page would work in one system but not the other. The worst bit is that when Safari doesn't render something properly, it does so without any indication. You have to debug line for line, a dreadful experience.
I have also seen problems in Safari for Windows that don't exist in Safari for Mac on CSS heavy websites. Can't remember the specifics, but they were there.
I am currently experiencing an issue where floating images in a blog with text wrapping around the image do not properly pad themselves in OS X; works fine in windows. Basically I've added padding to make the image align flush left or right such that the edge of the image is at the same offset as the edge of the text of the post; on OS X the image sticks out past the edge of the text.
A site I am working on now has a problem in safari for mac that isn't in safari 3 or 4 for windows. I cant figure it out for the life of me.
A call to java from javascript throws:
java.net.MalformedURLException: no protocol:
at java.net.URL.(Unknown Source)
at java.net.URL.(Unknown Source)
at java.net.URL.(Unknown Source)
at sun.plugin.liveconnect.SecureInvocation.checkLiveConnectCaller(Unknown Source)
at sun.plugin.liveconnect.SecureInvocation.access$000(Unknown Source)
at sun.plugin.liveconnect.SecureInvocation$2.run(Unknown Source)
at java.security.AccessController.doPrivileged(Native Method)
at sun.plugin.liveconnect.SecureInvocation.CallMethod(Unknown Source)
on Safari windows but not safari mac.
Just wanted to add this experience I came across for Safari. Our devs are still going to look into this but not high priority for us since Windows Safari isn't much of our user base unlike Mac. But I think it relates to either (or both) - actual browser low level implementation of Safari by Apple, and/or javascript differences.
Our website recently implemented an HTML5 multiple file uploader. Single file uploads work fine on both versions of Safari. But when uploading multiple files, it fails on Windows. We had two different upload clients & endpoints for the uploader (think A/B testing flow), and one of them provided more details that may or may not point at the cause of the problem. On one of the client & endpoints, the client would send details of the filenames & filesizes of files to upload (as JSON array object) to the server endpoint (as seen via web inspector). On Mac where it worked, filesizes were valid, on Windows, they were 0 bytes.
I think the uploader is JQuery based or some other JS library. But I'm not the dev, so can't be sure. But I have a hunch this issue goes beyond JS libraries...
I had an issue with the popup blocker in Safari in Windows XP. I guess the blocker didn't accept that the user clicked a link an Flash that then triggered a JavaScript that opened the Window. The did work in the other major browsers and Safari in OS X, though. Chrome also blocked my window in XP, but not in OS X or Ubuntu.
In Mac Safari I'm able to do cross script ajax with file:/// protocol, but in Windows Mac I'm unable to do this.
I am working on a website that has pretty standard layout. I have a box that contains other divs. It works on all major browsers, from IE6+, FF3+, etc. On Safari 5 on OSX, the box is totally to the left, outside the borders of my website. On the same safari version in windows, no problem.
I am going crazy over this.