flex and animation

[beginner123]

hi,

i have a div(class=”main”) with 3 other divs inside which i want to animate.
i tried with:

.main {display:flex; animation-name: animation; animation-duration: 10s; animation-timing-function:linear; animation-delay: 2s; animation-iteration-count: infinite; animation-play-state: running;}

@keyframes animation {
0% {align-items:flex-start;}
20% {align-items:flex-end;}
40% {align-items:stretch;}
60% {align-items:baseline;}
80% {align-items:center;}
100% {align-items:initial;}
}

but nothing happend.. can someone help me?

[Paulie_D]

My first question is “is align-items animatable in the first place”?

My initial guess is “NO”.

EDIT – Seems I was right – https://developer.mozilla.org/en-US/docs/Web/CSS/align-items

[Paulie_D]

So, with that, what are you actually trying to achieve?

[Author]

Posts