Skip to content

Instantly share code, notes, and snippets.

@gampleman
Created November 5, 2010 15:36
Show Gist options
  • Save gampleman/664296 to your computer and use it in GitHub Desktop.
Save gampleman/664296 to your computer and use it in GitHub Desktop.
CSS to make a Departure board
#4606367513 {
padding: 5px 10px;
display: inline-block;
background: rgb(30, 30, 30);
background: -webkit-gradient(linear, center top, center bottom,
color-stop(0.0, rgba(0,0,0, 1)),
color-stop(0.05, rgba(30,30,30, 1)),
color-stop(1.0, rgba(50, 50, 60, 1)));
background: -moz-linear-gradient(270deg,
rgba(0,0,0,1) 0%,
rgba(30, 30, 30, 1) 5%,
rgba(50, 50, 60, 1) 100%);
/* border radius */
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
-khtml-border-radius: 3px;
border-radius: 3px;
font-weight: normal;
text-transform: uppercase;
color: white;
/* box shadow */
-webkit-box-shadow:
inset 0 -1px 0 rgba(50,50,50,0.7),
inset 0 -2px 0 rgba(0,0,0,0.7),
inset 2px 0px 4px rgba(0,0,0,0.9),
inset -2px 0px 4px rgba(0,0,0,0.9),
0 1px 0px rgba(255,255,255,0.2);
-moz-box-shadow:
inset 0 -1px 0 rgba(50,50,50,0.7),
inset 0 -2px 0 rgba(0,0,0,0.7),
inset 2px 0px 4px rgba(0,0,0,0.9),
inset -2px 0px 4px rgba(0,0,0,0.9),
0 1px 0px rgba(255,255,255,0.2);
box-shadow:
inset 0 -1px 0 rgba(50,50,50,0.7),
inset 0 -2px 0 rgba(0,0,0,0.7),
inset 2px 0px 4px rgba(0,0,0,0.9),
inset -2px 0px 4px rgba(0,0,0,0.9),
0 1px 0px rgba(255,255,255,0.2);
}
#4606367513:before {
/* approximation for old browsers */
border-top: 1px solid rgb(30, 30, 30);
border-top: 1px solid rgba(0,0,0,0.4);
border-bottom: 1px solid rgba(255,255,255,0.08);
height: 0px;
width: 110%;
position: relative;
left: -9px;
top: 11px;
content: " ";
display: block;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment