Skip to content

Instantly share code, notes, and snippets.

@jvandyke
Created February 26, 2014 22:15
Show Gist options
  • Save jvandyke/9239770 to your computer and use it in GitHub Desktop.
Save jvandyke/9239770 to your computer and use it in GitHub Desktop.
Replace text in an element with CSS
<button class="element">Old text</button>
.element {
text-indent: -9999px;
line-height: 0; /* Collapse the original line */
}
.element::after {
content: "New text";
text-indent: 0;
display: block;
line-height: initial; /* New content takes up original line height */
}
@arthurpbarros
Copy link

arthurpbarros commented Feb 9, 2022

Works fine. It's very interesting

@SyntaxIDK
Copy link

Thanks !

@chk49
Copy link

chk49 commented Mar 27, 2025

Used this for a site that allow some CSS, the trick's still useful a decade later.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment