Tell me more ×
Webmasters Stack Exchange is a question and answer site for pro webmasters. It's 100% free, no registration required.
up vote -2 down vote favorite

I know font rendering is very tricky and it will be different between browsers and operating systems (eg. Firefox and Chrome will render differently on Windows) but what I puzzled about is how the same browser can render HTML/CSS differently on two different operating systems.

I just installed Firefox 18 on Linux x86_64 and Windows 8 and the Outlook.com website is completely broken on Linux. Fonts look different, sure, that's not the problem. The problem is DIVs are overlapping, images are misplaced, etc.

Of course it's just this website and it could be the one to blame. Any other idea why HTML/CSS would render different in Linux and Windows? Different extensions being enabled? I don't have any plugin messing with websites.

share|improve this question
There are just to many variables please link to the site for further testing or display the CSS and HTML elements are effected. – bybe♦ Jan 15 at 14:21
it's outlook.com and you need an free account to access it. – gtirloni Jan 15 at 14:25
A couple of screenshots would be handy (at least go some way to satisfying our curiosity)... you seem to be suggesting that outlook.com is the only site affected in this way? In which case this does kind of point towards an issue with outlook.com? For DIVs to be overlapping and images misplaced it sounds like something quite fundamental is amiss? Are you able to change the UA in Linux Firefox to fake another browser, or to even fake the Windows Firefox? – w3d Jan 15 at 16:02
1  
Voting to close. Diagnosing other people's site problems, to no apparent gain(unless you're building an outlook.com clone), doesn't belong here. If you're complaining as a user, find their contact link/form and let them know. – Su' Jan 15 at 21:03

closed as not constructive by Su', John Conde♦ Jan 15 at 23:43

As it currently stands, this question is not a good fit for our Q&A format. We expect answers to be supported by facts, references, or specific expertise, but this question will likely solicit debate, arguments, polling, or extended discussion. If you feel that this question can be improved and possibly reopened, see the FAQ for guidance.

2 Answers

up vote 0 down vote

This is reaching, but the div's might overlap if something is calculating the div width and image location based on the font width and wrapping, but the font width is not correct. To test this, use Chrome on Windows 8 and Linux. The two instances should end up using the same fonts as Firefox. If the problem is the same, blame the fonts. You might try to zoom in or out and see if this changes things.

share|improve this answer
up vote 0 down vote

First of all, different OSes have different fonts - for licensing reasons. The font may be installed on Windows, but Linux may not have it and vice versa.

Secondly, it may be made by the same company and have the same name, but it's not the same software. The code behind creating a program in Windows is different from that in Linux or any other OS. There are nuances here and there. How it communicates with the OS is also different. Firefox is also open source is community-driven, meaning that if I wanted to improve Firefox, I may have decided to work on the Linux version and not the Windows or Android version.

Third, Microsoft is notorious for implementing non-standards-compliant markup (HTML, CSS, etc) into its browsers. They probably care more about Windows and Internet Explorer. They probably don't care as much for Firefox and Linux, and how their website is perfect on there. Maybe they're taking advantage of something available on Windows that's not on your Linux (Silverlight, Flash, etc.).

Lastly, web design is not an exact science.

share|improve this answer
Thank you. What I get is that there are too many variables affecting it. My initial idea was that the HTML/CSS renderer would be identical but that doesn't seem like it. Like I said, I expected the fonts to differ a lot but the overall look to work. – gtirloni Jan 16 at 14:27

Not the answer you're looking for? Browse other questions tagged or ask your own question.