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;