Skip to content

Instantly share code, notes, and snippets.

@visoft
Created March 24, 2013 23:07
Show Gist options
  • Save visoft/5233997 to your computer and use it in GitHub Desktop.
Save visoft/5233997 to your computer and use it in GitHub Desktop.
Simple CSS close button
.close_button {
-moz-box-shadow:inset 0px 1px 0px -23px #f29c93;
-webkit-box-shadow:inset 0px 1px 0px -23px #f29c93;
box-shadow:inset 0px 1px 0px -23px #f29c93;
background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #fe1a00), color-stop(1, #ce0100) );
background:-moz-linear-gradient( center top, #fe1a00 5%, #ce0100 100% );
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#fe1a00', endColorstr='#ce0100');
background-color:#fe1a00;
-moz-border-radius:5px;
-webkit-border-radius:5px;
border-radius:5px;
border:1px solid #d83526;
display:inline-block;
color:#ffffff;
font-family:Verdana;
font-size:13px;
font-weight:bold;
padding:3px 7px;
text-decoration:none;
text-shadow:1px 1px 0px #b23e35;
}.close_button:hover {
background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #ce0100), color-stop(1, #fe1a00) );
background:-moz-linear-gradient( center top, #ce0100 5%, #fe1a00 100% );
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ce0100', endColorstr='#fe1a00');
background-color:#ce0100;
}.close_button:active {
position:relative;
top:1px;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment