搜索 | 用户支持

防范以用户支持为名的诈骗。我们绝对不会要求您拨打电话或发送短信,及提供任何个人信息。请使用“举报滥用”选项报告涉及违规的行为。

Learn More

Website (css stylesheet) differences between PC and Mac

  • 2 个回答
  • 5 人有此问题
  • 1 次查看
  • 最后回复者为 knalstaaf

more options

Firefox 6.0 on a PC (Vista - 32bit) interprets stylesheets differently than on Firefox 6.0 on Mac (OSX - 10.5.6). It doesn't seem to be a font-issue, but rather a margin/padding issue.

Firefox 6.0 on a PC (Vista - 32bit) interprets stylesheets differently than on Firefox 6.0 on Mac (OSX - 10.5.6). It doesn't seem to be a font-issue, but rather a margin/padding issue.

由knalstaaf于修改

所有回复 (2)

more options

Can you attach screenshots to illustrate what you mean?

Use a compressed image type like PNG or JPG to save the screenshot and make sure that you do not exceed the maximum file size (1 MB).

more options

Display on PC

Display on Mac

I solved this by using a conditional css file and a javascript that detects the platform. Not the best practice, but it does the job for the time being. Question is, what will it do once the bug in Firefox gets fixed - if it's considered as such ofcourse.

On second thought: this may be a font bug after all. The current font of the menu items is Melbourne Regular, using font replacement. It's possible to lay both images over each other to see what the differences are between fonts on both the platforms. Fact is: the height of the characters itself doesn't seem to be the issue, but rather the (horizontal) spacing. What it does to the vertical spacing is not really clear, and that's where the mentionned issue seems to be. There seems to be an extra 2px margin on top of the menu item.

The script that detects the platform in order to enable the conditional css for FIrefox on Mac OSX:

<script language="javascript" type="text/javascript">

   if(navigator.userAgent.indexOf('Mac') > 0 && navigator.userAgent.indexOf('Firefox') > 0)
   {document.write ('<link rel=\"stylesheet\" href=\"http://domain.com/sites/all/themes/mytheme/ffxosx.css\" type=\"text/css\" media=\"screen\" />');}
 </script>