css hover transition is not working

Question

I created a simple div element and gave following css properties
div{
width: 100px;
height: 100px;
background: yellow;
transition: 1s;
}
div:hover{
background: green;
}
But it dosent work on my ipad.I wrote the same code on an online html editor and it worked fine.I cant figure out the issue. Thanks for your time...👍🏻

Answer 1

https://dev.webonomic.nl/fixing-the-iphone-css-hover-problem-on-ios

Answer 2

transition: background-color 1s;
or
transition: all 1s;