css - :hover and leaving :hover? 之间的转换

Question

所以我试图让我的分页在悬停时平滑地滑动，然后在鼠标离开元素后滑回其原始位置。我已经让它在悬停时滑动，但是当鼠标离开按钮时，它只是快速返回而不是过渡。有人可以帮我解决这个问题吗？

这是我的代码。

#pagination {
   width: auto;
   margin-top: 4px;
   font-size: 40px;
   height: auto;
   border-left: 5px solid #2F4F4F;
   border-right: 1px solid #2F4F4F;
   text-shadow: 
   -1px 1px #000000;
   -2px 2px #000000;
   -3px 3px #000000;
   background: #ffffff;
   -webkit-transition: all 0.5s ease-in-out;
   -moz-transition: all 0.5s ease-in-out;
   -o-transition: all 0.5s ease-in-out;    
}

#pagination :hover {
    background: #2F4F4F;
    border-left: 15px solid #2F4F4F;
    border-right: 1px solid #7A8B8B;
    width: auto;
   -webkit-transition: all 0.5s ease-in-out;
   -moz-transition: all 0.5s ease-in-out;
   -o-transition: all 0.5s ease-in-out;    
}

Answer 1

:hover 需要在元素后指定，没有空格。

#pagination :hover

到

#pagination:hover