Преобразование Webkit вращается при наведении псевдо-не работает в сафари

Question

У меня есть элемент списка с псевдограничным набором для каждого из них, мой эффект зависания работает в google chrome, но не работает в сафари, они оба используют один и тот же движок рендеринга, поэтому почему он не работает?

.page-content ol li:before { 
     background: #338ec9; 
     background: url(../images/tie.png) no-repeat 0; 
     margin-bottom: 1em; 
     padding-left: 35px; 
     font-size: 1.2em; 

    position: absolute;  
    left: 0; 
    top: -2px; 

    height: 25px; 
    width: 17px; 
    line-height: 25px; 

    font-size: 12px; 
    text-align: center; 

    border-radius: 2em; 
    color: transparent; 
    transition: 0.6s;  
} 

.page-content ol li:hover:before {   
    -webkit-transform: rotate(-360deg); 
    transform: rotate(-360deg); 
} 

Answer 1

добавить

-webkit-transition:0.6s; 

в

.page-content ol li:before 

он должен сделать трюк, занесенный:
http://www.w3schools.com/css/css3_transitions.asp