I did some HTML & CSS work on a site and it's displaying fine in Firefox, IE, and Chrome on Windows Vista. However, I was recently made aware that it isn't showing up properly in Firefox on a Mac. What would be the best way to go about remedying this situation? Is there a Firefox plugin out there that will simulate a Mac environment and render pages accordingly, sort of like the IE Tab plugin? Any help here would be much appreciated - Thanks in advance!
You haven't said what the differences are, or given us an opportunity to see for ourselves. On the whole, there are no significant differences for Firefox on different platforms. There are some user configurable diffs, based on common platform defaults, e.g. fonts, font sizes, and chromes for starters. Please tell us your specific issue(s), so we can try to help you. cheers, gary
Gary, thanks for the response. Attached are screen shots of the affected area of the client's site on a PC and on a Mac, both using Firefox. A feedburner feed is used to show the 3 newest blog posts, and some CSS is used to display them in this manner. If you need any other info from me, please let me know. The first image is from the Mac, second is from PC.
The text is marginally larger for the mac. Have you tried setting a specific font size in the css to stop this? E.g .newsdiv { font-size: 12px; }
I'm not sure where to start. You need to fix your syntax errors. They may not be causing problems now, but you can't depend on that holding through the next page update. You have a bunch of inlined styles for which I see no reason; especially all that absolute positioning. I'm not working near a Mac at this time, so I'll suggest you make yourself a minimal test case. Use this part, <!-- start of AM Blog Feed --> <div style="text-align:left;background:url(/lib/mustangtuning/am-news-bg.jpg) no-repeat; padding: 22px 0 0 19px;"> <script src="http://feeds.feedburner.com/americanmuscleblog?format=sigpro&displayDate=true" type="text/javascript"> </script> <noscript> <p>Javascript must be enabled to display AmericanMuscle Blog News</p> </noscript> </div><br /> <!-- end of AM Blog Feed --> Code (markup): Paste the imported js into the page in place of the linked src, and embed your css in the head section for working ease. (Gawd, how I hate inlined, obtrusive javascript.) Then start fiddling with the style rules to see where the issue lies. cheers, gary
Hi, I think it is something related to "float : left" code. The list seems to join with previous list. May be this idea can help you, Best Regards, Nirmal