#1
  1. No Profile Picture
    Contributing User
    Devshed Novice (500 - 999 posts)

    Join Date
    Aug 2004
    Posts
    603
    Rep Power
    141

    Chrome Zoom seems different than Firefox and IE


    Hello,

    I am developing a website and I am doing my best to make look the same on all browsers. I started developing the website on Chrome. I then tried it on Firefox and noticed how the website (images, text, etc) look much bigger on firefox then on Chrome. The same applies for IE.

    To make Chrome show the website like Firefox I need to go to the Chrome and set Zoom to 120%.

    To make Firefox show the website like Chrome I need to go to Firefox and set Zoom out (on Firefox I never get same view as on Chrome however, div's width does not seem to change).

    I was wondering if anyone has seen this issue? From where it is coming? and if there is a way how I can fix zoom at 100% on all browsers (from CSS?) so that someone would not need to change his browser settings so to see the website the same on all browsers.
  2. #2
  3. A Not To Shabby Code Smurf
    Devshed Beginner (1000 - 1499 posts)

    Join Date
    Aug 2008
    Posts
    1,176
    Rep Power
    184
    Why are you using zoom; why not use common units of measurement? It looks like to me; if you were coding your CSS, in such a way; that the dimensions would be the same (cross-browser) and there would not be a need for using zoom.

    Like:
    Code:
    span, div, p, table {
    font-size:24px; /* or... use percentage unit => 150% */
    }
    Last edited by web_loone08; February 26th, 2014 at 10:41 PM.
  4. #3
  5. No Profile Picture
    Contributing User
    Devshed Novice (500 - 999 posts)

    Join Date
    Aug 2004
    Posts
    603
    Rep Power
    141
    I am not referring to just font sizes. All of the website looks more zoomed on firefox then on Chrome. I attached some screenshots of how cnn.com looks on FireFox and on Chrome. You can see that on FireFox things just look bigger.

    Is there a way how I can develop a website so that it would look the same on both Chrome and FireFox (in terms of this zooming) ... has no one else noticed this?

    Links:
    https://dl.dropboxusercontent.com/u/27542229/chrome.png
    https://dl.dropboxusercontent.com/u/...29/firefox.png


    Note how in both images window size is the same but everything on FireFox looks bigger then on Chrome.
  6. #4
  7. A Not To Shabby Code Smurf
    Devshed Beginner (1000 - 1499 posts)

    Join Date
    Aug 2008
    Posts
    1,176
    Rep Power
    184
    Is there a way how I can develop a website so that it would look the same on both Chrome and FireFox (in terms of this zooming) ... has no one else noticed this?
    Most developers are looking to make their sites look the same cross browser; but they are not that tedious. More then likely..., this has to do with the different browsers rending/layout engines. You could do some research about the different variations, in browser rending/layout engines and then use Advanced CSS Conditional Statements or JavaScript browser detection (basic JavaScript or a JavaScript Library... such as "jQuery"); to accomplish a cross browser layout clone (maybe). Honestly... in my opinion, you would be going above and beyond (with your layout design); to make all layouts (in every browser) 100% identical (in every single way), but good luck..., if you choose to do this..., I hope it turns out well.
  8. #5
  9. No Profile Picture
    Contributing User
    Devshed Novice (500 - 999 posts)

    Join Date
    Dec 2003
    Posts
    710
    Rep Power
    441
    Here's a dumb question...are you sure you don't have Firefox set to a higher zoom by default? If I visit cnn.com in Firefox and Chrome they look the same.

    Maybe it's something along these lines? https://support.mozilla.org/en-US/questions/963759

IMN logo majestic logo threadwatch logo seochat tools logo