CSS滑動下劃線在Safari中不起作用？

我創建了一個導航菜單，每個超鏈接都有一個「滑動下劃線」效果。CSS滑動下劃線在Safari中不起作用？

相關代碼：

/* sliding underline */ 

    nav li a:after { 
     content: " "; 
     display:block; 
     margin: 5px 0px 0px 0px; 
     border-bottom: 3px solid transparent; 
     width: 0px; 
     transition: 0.5s ease; 
     } 

     nav li a:hover:after { 
      border-bottom: 3px solid #0076a3; 
      width:50px; 
      }

此解決方案在Chrome 而不是在Safari。有誰知道這可能是爲什麼？

來源

2013-10-24 ghilton