Transitioning & Animation The Same Property - You can't!

dabblet.css

/**
 * Transitioning & Animation The Same Property - You can't!
 */
 *{transition:all 1s ease;}
 
 @keyframes move{
 0%{height:200px;width:200px;}
 50%{height:300px;width:300px;}
 }
 
div{
display:block;
height:200px;
width:200px;
background:#ff6;
animation-name:'move';
animation-duration: 10s;
animation-iteration-count: infinite;
animation-timing-function:ease-in-out;
}

div:hover{
width:400px;
background:red;
}

dabblet.html

<div></div>

settings.json

{"view":"split","prefixfree":"1","page":"css"}