Chrome OSX hover not fired on document load

I am facing a strange issue on chrome OSX

The hover style or hover event is not firing on element untill you move your mouse. Even a little movement trigger the hover style.

Here is the sample code

CSS and HTML

 div {
      width: 100px;
      height: 100px;
      background-color: red;
    }

    div:hover {
      background-color: green;
    }
<div>Dummy Text</div>

This is pretty basic code sample normally when you place your cursor upon div the background color changed to green. Left your cursor on the div and reload page using F5 it will still be green. But this is not the case on OSX chrome. OSX chrome will continue to show red box untill you move your mouse.

This is pretty basic problem of a bigger problem in my case.


Source: cross-browser

Leave a Reply