Skip to content

Instantly share code, notes, and snippets.

@samccone
Created April 24, 2012 02:29
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save samccone/2475591 to your computer and use it in GitHub Desktop.
Save samccone/2475591 to your computer and use it in GitHub Desktop.
Untitled
body {
background-color:#DDD
}
.green {
background: #2eb760;
background: -moz-linear-gradient(top, #2eb760 0%, #1b9746 71%, #199540 88%, #1b9a35 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#2eb760), color-stop(71%,#1b9746), color-stop(88%,#199540), color-stop(100%,#1b9a35));
background: -webkit-linear-gradient(top, #2eb760 0%,#1b9746 71%,#199540 88%,#1b9a35 100%);
background: -o-linear-gradient(top, #2eb760 0%,#1b9746 71%,#199540 88%,#1b9a35 100%);
background: -ms-linear-gradient(top, #2eb760 0%,#1b9746 71%,#199540 88%,#1b9a35 100%);
background: linear-gradient(top, #2eb760 0%,#1b9746 71%,#199540 88%,#1b9a35 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#2eb760', endColorstr='#1b9a35',GradientType=0 );
}
.red {
background: #fd0c0f;
background: -moz-linear-gradient(top, #fd0c0f 0%, #f70b0f 23%, #e2090d 68%, #e00910 73%, #c80610 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#fd0c0f), color-stop(23%,#f70b0f), color-stop(68%,#e2090d), color-stop(73%,#e00910), color-stop(100%,#c80610));
background: -webkit-linear-gradient(top, #fd0c0f 0%,#f70b0f 23%,#e2090d 68%,#e00910 73%,#c80610 100%);
background: -o-linear-gradient(top, #fd0c0f 0%,#f70b0f 23%,#e2090d 68%,#e00910 73%,#c80610 100%);
background: -ms-linear-gradient(top, #fd0c0f 0%,#f70b0f 23%,#e2090d 68%,#e00910 73%,#c80610 100%);
background: linear-gradient(top, #fd0c0f 0%,#f70b0f 23%,#e2090d 68%,#e00910 73%,#c80610 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fd0c0f', endColorstr='#c80610',GradientType=0 );
}
.btn:active {
box-shadow: inset 0px 2px 4px rgba(0,0,0,0.3);
}
.btn {
cursor: pointer;
font-family: helvetica;
font-weight: bold;
color: #FFF;
border-radius: 3px;
font-size: 13px;
box-shadow: inset 0px 1px 0px rgba(255,255,255,0.5);
padding: 3px 10px;
display: inline-block;
border: solid 1px #000;
}
<div class="btn green">foo bar</div>
<div class="btn red">foo bar</div>
{"view":"split","fontsize":"100","seethrough":"","prefixfree":"1","page":"all"}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment