Попробуйте так:
@keyframes logo{
100%{
transform: scale(1.5) translateY(50px);
}
}
Почему? Потому что так написано в
спецификации, например.
Если вы напишете
h1 {
color: red;
color: blue;
}
Вас же не удивит, что в результате будет применен синий цвет?
Впрочем, две записи transform тоже могут иметь смысл:
With 3D support, the second definition will override the first one. Without 3D support, the second definition is invalid and a UA falls back to the first definition.
div {
transform: scale(2) rotate(45deg);
transform: scale(2) rotate3d(0, 0, 1, 45deg);
}
