Skip to content

Instantly share code, notes, and snippets.

@Victa
Created September 19, 2011 09:07
Show Gist options
  • Star 4 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save Victa/1226182 to your computer and use it in GitHub Desktop.
Save Victa/1226182 to your computer and use it in GitHub Desktop.
CSS3 inset text-shadow trick
<h1 class="inset-text">Inset text-shadow trick</h1>
h1 {
font-family: Helvetica, Arial, sans-serif;
font-weight: bold;
font-size: 6em;
line-height: 1em;
}
.inset-text {
/* Shadows are visible under slightly transparent text color */
color: rgba(10,60,150, 0.8);
text-shadow: 1px 4px 6px #def, 0 0 0 #000, 1px 4px 6px #def;
}
/* Don't show shadows when selecting text */
::-moz-selection { background: #5af; color: #fff; text-shadow: none; }
::selection { background: #5af; color: #fff; text-shadow: none; }
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment