css Audio - Active file-generic CSS - Active Generic - Active HTML - Active JS - Active SVG - Active Text - Active file-generic Video - Active header Love html icon-new-collection icon-person icon-team numbered-list123 pop-out spinner split-screen star tv
user profile image

An easy way to change Text in :hover and :active, only with CSS. Using data attribute and :before, :after pseudo-element.


  1. content: attr(data-active); I had no idea the support for this would be so great. Thanks for this pen! :)

  2. Dennis,

    Thks ;)

    You will find an answer here : https://developer.mozilla.org/en-US/docs/Web/CSS/attr

    I try it on IE9-10-11, Chrome, Firefox, Safari and Opera, and it works in every one, with latest version.

Leave a Comment Markdown supported. Click @usernames to add to comment.

You must be logged in to comment.