Skip to content

Instantly share code, notes, and snippets.

@sthembi
Forked from anonymous/dabblet.css
Created October 20, 2012 16:02
Show Gist options
  • Save sthembi/3923746 to your computer and use it in GitHub Desktop.
Save sthembi/3923746 to your computer and use it in GitHub Desktop.
CSS3 borders and box-shadow experiment
/**
* CSS3 borders and box-shadow experiment
*/
body {
/*background: #f06;
background: linear-gradient(45deg, #f06, yellow);*/
min-height: 100%;
}
button {margin:40px;}
button.css3button {
font-family: Arial, Helvetica, sans-serif;
font-size: 14px;
color: #050505;
padding: 300px 200px;
background: -moz-linear-gradient(
top,
#ffffff 0%,
#ebebeb 50%,
#dbdbdb 50%,
#b5b5b5);
background-color: #AEC5D0;
/*background: -webkit-gradient(
linear, left top, left bottom,
from(#ffffff),
color-stop(0.50, #ebebeb),
color-stop(0.50, #dbdbdb),
to(#b5b5b5));*/
-moz-border-radius: 0px;
-webkit-border-radius: 0px;
border-radius: 0px 10px 8px 0px;
/* border: 2px solid #949494;
*/
border-top:1px solid #949494;
border-right: 3px double #CFCBCB;
border-bottom: 2px double #949494;
border-left:1px solid black;
outline: 0px 5px 5px 0px solid hsl(1, 20%, 60%);
-moz-box-shadow:
0px 2px 3px rgba(000,000,000,1),
inset -3px -2px 5px rgba(148,138,148,0.5);
-webkit-box-shadow:
4px 2px 30px rgba(7, 6, 6, 0.46),
inset -6px -5px 7px rgba(148,138,148,0.7),
inset -6px -5px 7px rgba(148, 138, 148, 0.5)
;
text-shadow:
0px -1px 0px rgba(000,000,000,0.2),
0px 1px 0px rgba(255,255,255,1);;;
}​
<!-- content to be placed inside <body>…</body> -->
<button type="button" name="" value="" class="css3button">submit</button>​
{"view":"split-vertical","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