Is it ok to apply a transition to all elements by adding it to the body?

Hi there,

I am finding that I am adding a transition to a lot of elements to create a smooth movement with elements that move.

I am using this:
transition: all .3s ease;

Is there any hard applying this to the body so it applies to all elements? And then if I need to adjust the transition on specific elements, I can create other rules/classes for those?

I just wondered if this is good practice or not?

Any thoughts would be great! Thanks.

That would only work for transitions on the body element as transitions are not inherited

You’d need to use the universal selector to do what you want and that would likely incur a performance hit depending on the complexity of the page.

Why don’t you use a css variable for the transition value and then you can change the value in one place but you would of course still need to apply the rule to the elements concerned.

3 Likes