On hover the expanded part snapping back instead of staying that way, how do i fix this
7 Replies
The animation resets when done, you need to specify fill mode
animation: lineInserted 0.4s ease-in-out forwards;ok
thanks it worked , now i have this issue, on hover the animation gets applied to all cards
it's not really applied to all cards, but because they are is inside a grid container, the height grows for all.
add this rule to prevent it
it worked thanks 👍
this works fine but if i add a card below it, in the 2nd row it there , heigh of the 1st row expands
https://codepen.io/aldrinbright/pen/PoeENbK
don't set grid-template-rows.
now you are setting the rows to 1fr, so the rows will be the same height. if the second one grows,the first one will match that
if you really want to have a set amount of rows, then make it
grid-template-rows: repeat(4,auto)
if you don't set it, new rows will be made automatically with height autoit still grows