CODEWITHSUNDEEP
cssgoogle-chrome
ttdt dems
ttdt dems

Reputation: 11

Google chrome is changing css behavior

I have div class called rectangle and i wanted to make hover effect with transition using css, but Google browser dont let the hover works when the browser window is in fullscreen. I'm using Mac by the way.

this is how i'm doing the hover with css:

.rectangle:hover {
Background: #4CAF50;
    -webkit-transition: background 0.3s;
    -moz-transition: background 0.3s;
    -ms-transition: background 0.3s;
    -o-transition: background 0.3s;
transition: background 0.3s;

}

It works in Firefox and Safari browser in fullscreen, but google dont let it work in fullscreen and i dont know why. Please help me to fix this problem i'm not able to find a fix for it.

Upvotes: 1

Views: 189

Answers (1)

Knu
Knu

Reputation: 15136

I have 3 advices for you:

  • don't use uppercase in a property: background not "Background"
  • replace background by the more specific background-color
  • the :fullscreen pseudo-class might be useful in your case

Upvotes: 1

Related Questions