div遷移時にフォントの色が変わるのはなぜですか？ここ

Question

は、ボタンのホバー上のフォントの色も非常に短い時間を変更し、それが唯一のサファリに起こったときにjsfiddle https://jsfiddle.net/phmttrsh/

#btn { 
 
    font-size: 16px; 
 
    height: 34px; 
 
    width: 120px; 
 
    border: 1px solid #20ACB3; 
 
    text-align: center; 
 
    line-height: 34px; 
 
    background-color: #20ACB3; 
 
    color: #ffffff; 
 
    border-radius: 5px; 
 
    transition: transform 200ms cubic-bezier(0.25, 0.39, 0.39, 2.01); 
 
} 
 

 
#btn:hover { 
 
     cursor: pointer; 
 
     transform: scale(1.05); 
 
    }

<div id="btn">Click</div>

にもあります。

どうしてですか？

Answer 1

#btn { 
 
    font-size: 16px; 
 
    height: 34px; 
 
    width: 120px; 
 
    border: 1px solid #20ACB3; 
 
    text-align: center; 
 
    line-height: 34px; 
 
    background-color: #20ACB3; 
 
    color: #ffffff; 
 
    border-radius: 5px; 
 
    -webkit-transition : transform 200ms cubic-bezier(0.25, 0.39, 0.39, 2.01) , color 200ms; 
 
    -moz-transition : transform 200ms cubic-bezier(0.25, 0.39, 0.39, 2.01) , color 200ms; 
 
    -o-transition : transform 200ms cubic-bezier(0.25, 0.39, 0.39, 2.01) , color 200ms; 
 
    transition : transform 200ms cubic-bezier(0.25, 0.39, 0.39, 2.01) , color 200ms; 
 
} 
 

 
#btn:hover { 
 
     cursor: pointer; 
 
     transform: scale(1.05); 
 
     color:#fff 
 
    }

<div id="btn">Click</div>