Blog Code Snippets CSS

Smooth Transitions

Add this bit of code to ensure smooth transitions of elements:

* {
-webkit-transition: all 700ms;
transition: all 700ms;

This will apply to all elements and for all types of transitions; whether its related to the element’s height, width, positioning or font size.

It is especially useful for mobile responsive when the element size has to be made smaller to fit the device. By using this smooth transition, the change looks smooth and nice to the end user.