Slide in text when icon is hovered
Here's your demo with some work done on the CSS. It's a little long winded but gets the job done without JavaScript using only CSS transitions for animation. For some reason it animated better using max-width
instead of width
but I'm not sure why.
Demo: http://jsfiddle.net/Marcel/h9EX9/1/
When implementing properly, you might want to use an extra wrapper element to animate instead of the <a>
as you will have multiple <a>
elements in the "tags" button for example.