Skip to content

Instantly share code, notes, and snippets.

@walterrenner
Created December 7, 2012 08:38
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 walterrenner/4231815 to your computer and use it in GitHub Desktop.
Save walterrenner/4231815 to your computer and use it in GitHub Desktop.
Stylish kbd Element
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Stylish kbd Element</title>
<!-- CSS for nested kbd Elemnts -->
<style type="text/css">
kbd kbd {
padding:0.1em 0.6em 0.1em 0.6em;
border:1px outset #ccc;
font-size:0.7em;
font-family:sans-serif;
background-color:#fff;
color:#555;
-webkit-box-shadow:0 1px 0px rgba(0, 0, 0, 0.2),0 0 0 2px #ffffff inset;
-moz-box-shadow:0 1px 0px rgba(0, 0, 0, 0.2),0 0 0 2px #ffffff inset;
box-shadow:1px 1px 1px rgba(0, 0, 0, 0.1),0 0 1px 2px #f2f2f2 inset;
-webkit-border-radius:3px;
-moz-border-radius:3px;
border-radius:3px;display:
inline-block;margin:0 0.1em;
text-shadow:0 1px 0 #fff;
line-height:1.4;
white-space:nowrap;
}
</style>
</head>
<body>
<div>
<kbd><kbd>⌘</kbd></kbd> <kbd><kbd>⌥</kbd></kbd> <kbd><kbd>⌥</kbd></kbd>
</div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment