Chrome: Automatic Shift of Web Elements

Chrome: Automatic shift of web elements

This is to due the headline change in Chrome 37 ,the introduction of DirectWrite support for Windows.
Check this link for further details:

http://www.omgchrome.com/google-chrome-37-arrives-improved-font-rendering-windows/

This feature has caused a similar issue for various developers.

In order to restore to your previous font, the solution is to disable this new feature in your browser. You need to follow the following steps:

---

1> Enter chrome://flags/ in your address bar.

2> In the Disable DirectWrite Windows section click on Enable (actually disables it).

3> Click on Relaunch Now at the bottom.

4> Restart your browser.

---

Your original page design remains unchanged. :)

Chrome Automatically Moving Focus

There's probably a label wrapping the three elements.

Content shifts slightly on page reload with Chrome

add this in your css

.section { 
    width: 100vw; 
    height: 100vh !important; 
    z-index: 1; 
    max-width: 100%; 
}

Or You can add overflow-anchor: none; It works fine as well. I just found this link with the same issue Chrome Browser automatically scrolling

chrome/opera anchor shift away after adding dom elements

When every iframe ends loading tell the browser to go to that hash

$('iframe').load(function() {
    document.location.href = document.location.hash;
});

Position fixed on chrome mobile causing element to move on scroll up/down

I found out.

For some god forsaken reason, my beloved Google Chrome on mobile require minimum-scale=1 on the viewport meta.

<meta name="viewport" content="minimum-scale=1">

It works now.

---

Related Topics