My clients website and others are appearing hugely zoomed in on Chrome compared to other browsers on WINDOWS only (specifically Microsoft EDGE).
All browsers on Mac OS are displaying the website correctly at the correct scale.
Can anyone help explain what's going on here.
The website is https://emirat.co.uk
I just tried that website on my browsers and it looks the same on everyone...
Stupid question, but it may work: do you maybe have a default zoom for Edge?
EDIT: this is how it looks for me
Since Chrome 71, Chrome started scaling according to the setting the user had in Window, which is not the case for edge. you can force chrome to ignore windows setting by running chrome with:
/high-dpi-support=1 /device-scale-factor=1.125
or set the windows scaling to 100%.
Related
OK. This one has me stumped. It's a "asking for a friend" type of question.
My wife is an artist. She uses GoDaddy as her hosting service to display her work. She uses their tools. She's created a website and several of her paintings are there.
Her computer is a 27" iMac with MacOS 10.15.7 Catalina, retina display etc.
After she's done, she goes to her website and some pictures of her work have the wrong size.
ALL THREE BROWSERS-> Firefox, Chrome and Safari.
And this is after blasting all cookies/caches etc. (everywhere)
When I look using my home computer (Linux Mint) with either Chrome or Firefox, it looks OK.
When I look using my work computer (Windows 10) using Chrome, Firefox, Edge and Explorer, it looks OK.
When she looks with her MacBook laptop using Firefox, Chrome or Safari, it looks OK.
So it's only on her computer that the website looks a bit funky. Strange thing is that when she uses the GoDaddy website to create/modify her own website, the "preview mode" looks OK.
It's only when she actually points any of her browsers to her website does the rendering behave strangely.
GoDaddy tech support suggested the usual "clear cache/cookies/whatever and reboot". Same problem.
I tried changing the IP address and MAC on her computer but there is no difference.
Ideas?
it may be of high resolution, the responsiveness of the screen varies between different screen size
This can happen because of many things like -
Using Extensions or other apps in browsers can cause this issue.
Open the site and right-click on the site and click on inspect where you find changes and see the code and refer to your code whether there is any change? if there is a change then this is because of Media queries that have a breakpoint based on the screen width.
If the above ones are not the issue download a fresh copy of the browser and open the site then check and inspect.
Some change in recent Chrome versions (likely in June 2017) cause options in a <select> input to render much bigger than in other browsers (or in older versions of Chrome).
For example, dropdown on this w3schools page on some machines renders like this (Chrome 60.0.3112.90, 64 bit, Windows 10):
instead of expected (Firefox 55.0, 64-bit, Windows 10):
Is there any workaround that can be implemented in code to prevent it from happening (CSS solution preferred)?
So far I've found:
Discussion on Chrome product forums, which confirms that this is observed by many people, but there's no answer whether it was intentional or not. Also, observations were made that presence of touchscreen drivers in a system might cause this behaviour.
Chromium bug #739196 describing this issue, but also with no clear answer whether it's intentional or a Chromium bug
few answers suggesting that padding for <option>'s in a <select> can't be controlled via CSS by design, so this padding was never easy or possible to change.
Should be able to just add some CSS styling for the <option> tag to get it to look the way you want on most browsers.
http://jsfiddle.net/Ahreu/50/
The additional padding was added in Chrome 59 for any device that Chrome thinks has a touch interface. There currently is no way to disable this "feature".
Chrome shows two rows in Dropdown-menu
Google Chrome Help Forum
Observed same issue on Windows 10 + Chrome, with no actual touchscreen interface.
Uninstalling/installing "Synaptics Pointing Device" (touch pad on laptop) fixed the issue for me. As the other forums mentioned, it appears to be related to Chrome thinking it is on a touch enabled device. Worth a try to disable/re-install devices that may appear as such.
I got some text with
font-size:9px
But it is displaying correctly in Safari and Firefox but not with Mac/Chrome (V32).
Left is chrome [bad] / Right is Safari [correct]
I can see in the code inspector that my font is 9px but chrome switch to 10px :
I heard about the minimum font size in chrome and tried to disable the auto adjustment by following style but did not work.
Any idea?
* {
-webkit-text-size-adjust: none;
}
i can only tell WHY it's not working but this might help you to go looking for a different way to solve your problem.
from chrome version 28.0.1500.11 chrome doesn't support -webkit-text-size-adjust anymore. (changelist is here: http://trac.webkit.org/changeset/145168). and safari follows along. on newer mac os versions text-size-adjust is already gone too.
I have problems with it as well, since i've built a whole website on rem units to make it not only responsive but totally flexible. this worked pretty nice but all of a sudden everything is huge now. i'm working hard on a solution for this, but if anyone has an idea i didn't think of i'd appreciate that very much.
as soon as i find a solution i'll come back to let you know.
I got a really strange problem, and after so much tries and research I can't get out of it.
I have a website, but SOME (just 5% of visitors) people with the SAME version of chrome, see the text flowing out of divs and text overlapping. It's very strange because I tested the website on all chrome browsers using browser testers, without any problem. And in internet explorer or firefox this problem never happens...
A page is located here
And here are some screenshots of what SOME people see (maybe you won't see this in chrome)
click here
Maybe it is because of the font face I am using? Or maybe some bad coded CSS?
Please help me out of this!
Thanks a lot!
I see you use .svg font. Recently I was hunting some Chrome font rendering bugs and saw this:
http://code.google.com/p/chromium/issues/detail?id=95102
This seem very similar to issues you are having. You could try to serve some other font type to Chrome and if this would fix that.
If you don't want or can't serve some other font type to Chrome, the only thing you can do is wait until Chrome version 24 is out to all users which should be soon (I can't find any announcement)
I tested it in
Chrome 23.0.1271.97 m
Chrome 26.0.1371.0 canary
Chromium 25.0.1334.0 (169326)
# Windows 7 x64 and your page seems fine for me.
I have an <audio> element in a webpage. I'm happy to use the native browser controls, which are fine in Firefox, Safari, and Chrome for the Mac.
However, Chrome (12.0.742.122 on Windows 7) is displaying the native audio player without any background:
For comparison's sake, here's how it looks on Chrome (14.0.835.0) on OSX:
I realise my Mac's a couple of versions forward (it's on the dev channel) but this seems like a surprising issue. Any idea how to fix it?
Alternatively, can anyone recommend a completely painless player (with flash fallback) that I can drop it to style them all the same?
If you wrapped it in a div with a medium-gray background, wouldn't it work around the problem in Chrome 12 and still look the same in Chrome 14?
This is a known bug: http://code.google.com/p/chromium/issues/detail?id=82170