Transition в firefox (background-image)?

Question

[Kirill Granin]

Код:

.item{
    display: inline-block;
    vertical-align: top;
    height: 17px;
    margin-right: 2px;
    transition: all 0.2s
}
.item.vk{
    width: 30px;
    background: url('data:image/png;base64,...') no-repeat center}
.item.twit{
    width: 23px;
    background: url('data:image/png;base64,...') no-repeat center}
.item.ok{
    width: 19px;
    background: url('data:image/png;base64,...') no-repeat center}
.item.insta{
    width: 18px;
    background: url('data:image/png;base64,...') no-repeat center}
.item.vk:hover{background: url('data:image/png;base64,...') no-repeat center}
.item.twit:hover{background: url('data:image/png;base64,...') no-repeat center}
.item.ok:hover{background: url('data:image/png;base64,...') no-repeat center}
.item.insta:hover{background: url('data:image/png;base64,...) no-repeat center}

В firefox не срабатывает набор свойств transition, префикс -moz- проблему не решает

Вопрос остался открытым, нашел выход: менять будем не изображение а позицию изображения, объединив иконки в одну:

footer .footer-social-item{
    display: inline-block;
    vertical-align: top;
    height: 19px;
    margin-right: 2px;
    transition: all 0.30s linear 0s;
    background-repeat: no-repeat;
    background-position: 0 0;
}
footer .footer-social-item.vk{
    width: 30px;
    background-image: url('data:image/png;base64,...')}
footer .footer-social-item.twit{
    width: 23px;
    background-image: url('data:image/png;base64,...')}
footer .footer-social-item.ok{
    width: 19px;
    background-image: url('data:image/png;base64,...')}
footer .footer-social-item.insta{
    width: 18px;
    background-image: url('data:image/png;base64,...')}
footer .footer-social-item:hover{background-position: 0 -19px}

Answer 1

[Сергей Горячев]

transition: all 0.2s
не задана анимация, должно быть
transition: all 0.2s ease

Comments

[Serj-One]

Анимацию задавать необязательно. Единственный обязательный параметр - время, остальные будут выставлены по дефолту.