Skip to content

Instantly share code, notes, and snippets.

@lightyrs

lightyrs/shiny_buttons.css

Created June 8, 2011 17:39
Show Gist options
  • Save lightyrs/1014895 to your computer and use it in GitHub Desktop.
Save lightyrs/1014895 to your computer and use it in GitHub Desktop.
Download ZIP
Normalize CSS3 Buttons
Raw
shiny_buttons.css
.button:hover, .button:focus, .button:active {
text-decoration: none;
color: white;
background: #569107;
}
.button:active {
}
a:hover, a:active {
outline: none;
}
.button {
font: 1em/1.4 Calibri, sans-serif;
display: inline-block;
padding: 6px 15px;
border: 1px solid #487310;
margin: 20px 0 0;
font-size: 1.375em;
line-height: 1.273;
color: white;
background: #6EAD1A;
text-shadow: 0 1px 1px rgba(0, 0, 0, 0.4);
-moz-border-radius: 5px;
border-radius: 5px;
-webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.4), inset 0 1px rgba(255, 255, 255, 0.5), inset 0 12px rgba(255, 255, 255, 0.2), inset 0 10px 20px rgba(255, 255, 255, 0.25), inset 0 -12px 25px rgba(0, 0, 0, 0.3);
-moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.4), inset 0 1px rgba(255, 255, 255, 0.5), inset 0 12px rgba(255, 255, 255, 0.2), inset 0 10px 20px rgba(255, 255, 255, 0.25), inset 0 -12px 25px rgba(0, 0, 0, 0.3);
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.4), inset 0 1px rgba(255, 255, 255, 0.5), inset 0 12px rgba(255, 255, 255, 0.2), inset 0 10px 10px rgba(255, 255, 255, 0.25), inset 0 -12px 25px rgba(0, 0, 0, 0.3);
-webkit-transition: all 0.15s;
-moz-transition: all 0.15s;
-o-transition: all 0.15s;
transition: all 0.15s;
}
a {
font-weight: bold;
text-decoration: none;
color: #6EAD1A;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment