CSS – Transition Tips & Tricks

I’m amazed at how CSS has changed since the last time I looked into it. Something that previously required a tone of Javascript is now possible to implement by putting a single line of CSS code:

div {
  transition: all 0.5s ease;
  background: red;
  padding: 10px;

div:hover {
  background: green;
  padding: 20px;

That’s all it takes to transform a div from red to green and back again!

Source: http://css-tricks.com/almanac/properties/t/transition/


Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Blog at WordPress.com.

Up ↑

%d bloggers like this: