微軟Edge邊緣動畫問題

Question

只是好奇爲什麼這在Edge中不起作用。它適用於我檢查過的所有其他瀏覽器。Edge中是否存在導致此問題的錯誤？

Fyi這不是我的代碼，只是好奇。

/** 
* Animations 
*/ 
@keyframes checkboxCheckedAnimation { 
    50%, 100% { 
width: 100vw; 
height: 100vh; 
    } 
    100% { 
border-radius: 0; 
    } 
} 

@keyframes checkboxUncheckedAnimation { 
    0% { 
width: 100vw; 
height: 100vh; 
    } 
} 

@keyframes changeWidthOfElementAnimation { 
    50% { 
width: 0; 
    } 
    100% { 
width: 100%; 
    } 
} 

https://codepen.io/WispProxy/details/GqzoYg

Answer 1

不知道爲什麼這個工作，但是這並獲得成功。

@keyframes checkboxCheckedAnimation { 
    50% { 
width: 100vw; 
height: 100vh; 
    } 
    100% { 
border-radius: 0; 
// Added these lines 
width: 100vw; 
height: 100vh; 
    } 
}