I've been working on a new website and I keep all my files in a folder on my desktop for easy access. During the testing phase, I usually open the index page in various browsers to preview how it looks as I build it. Everything appeared correctly in Firefox, Safari, Chrome, and Opera on my Mac. However, when I uploaded the file to the server, Firefox on my Mac started displaying everything much smaller. It seemed like the width had decreased by 200px and the fonts were suddenly smaller too. The other browsers on my Mac still showed the site correctly.
Initially, I had 4 separate style sheets - one main sheet and three additional ones for different elements of the site. To troubleshoot the issue, I decided to combine all the styles into one sheet but this didn't solve the problem. I also tried changing the font sizes from percentages to pixels, thinking that may be causing the issue, but again, no change.
Does anyone have any suggestions on what else I can check to figure out why this sizing discrepancy is only happening in one browser?
Thank you.