Webkit Transition isnt working in Edge browser - html

Question

Afternoon, is there a reason as to why the css attribute -webkit-transition: all .8s ease-in-out;isn't doing what it's supposed to?
Browser is MS Edge, my code is below.
Thanks
Todd
.callToActionDefault:hover {
color: white;
text-decoration: none;
background: -webkit-gradient(linear, left top, left bottom, color-stop(20%, #0d89ca), color-stop(100%, #0d89ca));
background: -webkit-linear-gradient(top, #0d89ca 20%, #0d89ca 100%);
background: linear-gradient(to bottom, #0d89ca 20%, #0d89ca 100%);
}
.callToActionDefault {
padding: 8px;
font-size: 15px;
margin-top: 20px;
letter-spacing: 0.5px;
color: white;
width: 60%;
display: block;
position: relative;
background: -webkit-gradient(linear, left top, left bottom, color-stop(20%, #219cdd), color-stop(100%, #0d89ca));
background: -webkit-linear-gradient(top, #219cdd 20%, #0d89ca 100%);
background: linear-gradient(to bottom, #219cdd 20%, #0d89ca 100%);
bottom: 0;
font-weight: 700;
-webkit-transition: all .8s ease-in-out;
}
<a class="callToActionDefault" href="#">This is a button</a>

Answer 1

It doesn't work, because Edge is not a Webkit-based browser. The -webkit- prefix is a feature of old Webkit-based browsers such as Google Chrome.
In order to achieve maximum compatibility with older and newer browsers use the following code:
-webkit-transition: all .8s ease-in-out; // Old Chrome, Safari
-moz-transition: all .8s ease-in-out; // Old Firefox
-ms-transition: all .8s ease-in-out; // Internet Explorer
-o-transition: all .8s ease-in-out; // Old Opera
transition: all .8s ease-in-out; // Newer Browsers