Задать вопрос
@Shuboanator

Почему анимация не работает?

<style>
#container{
	border:2px #333333 solid;
	height: 200px;
	width:400px;
}
#logo{
	width:40px;
	height:40px;
	background:#000;
}
#container:hover #logo{
	width:40px;
	height:40px;
	background:#000;
	animation:logo 2s linear;
}


@keyframes logo{
 0% {
	 margin-left:0%;
    }
 100% {
	 margin-left:50%;
    }
}
</style>
</head>
<body>
<div id="container">
	<div id="logo">
    </div>
</div>
</body>


Почему не работает данная анимация?
  • Вопрос задан
  • 2411 просмотров
Подписаться 3 Оценить Комментировать
Помогут разобраться в теме Все курсы
  • Яндекс Практикум
    Профессиональная вёрстка на HTML и CSS
    3 месяца
    Далее
  • Stepik
    Основы HTML и CSS
    2 недели
    Далее
  • OTUS
    HTML/CSS
    3 месяца
    Далее
Решения вопроса 1
v_decadence
@v_decadence
Нужно префиксы расставлять.
Например, для WebKit

-webkit-animation
@-webkit-keyframes

jsfiddle.net/v52cQ/2
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы