I have a problem with this page . I developed it in Firefox at the default zoom level. The idiot I am, I have not tested it on Chrome. So, now I see that the page layout and / or font size are different in Chrome and other Webkit browsers. The default zoom level of Chrome is 75%, so Chrome is getting smaller. I have to say that I made a dozen web applications, but focused on the backend side of the application and never put a lot of thoughts on how the page looks in diffrenet browsers.
I mean, if I needed to cross the JavaScript browser, but this is something that I have never encountered.
What I consider wrong is the font size. I have #main-wrapone that wraps the entire application and has a base font size 16px. Thus, it #navigation ahas 0.7em, thus, it looks normal in Firefox, but it looks very small in Chrome.
Can someone post some tips or tricks on how this happens?
EDIT
I fixed the problem with
zoom: 1.29;
-moz-transform: scale(1);
-moz-transform-origin: 0 0;
And it works, but as I know it’s good to do it like this. Is there a CSS way to make pages look the same in all browsers?
source
share