CSS Quick Tip #1 - 1px Bounce Click Effect

Have you ever been on a website a wondered how to achieve that nice 1 pixel bounce when you click on a link or button? It’s easy to do with a simple line of CSS applied to the a:active state:

a:active { outline: 0; position: relative; top: 1px; }

Give it a try, it’s a neat little effect that adds an extra touch to your links.

Tweet