Skip to content

Instantly share code, notes, and snippets.

@formariz

formariz/dabblet.css

Created February 6, 2014 20:05
Show Gist options
  • Save formariz/8851591 to your computer and use it in GitHub Desktop.
Save formariz/8851591 to your computer and use it in GitHub Desktop.
Download ZIP
Navigation menu inline right-to-left
Raw
dabblet.css
/**
* Navigation menu inline right-to-left
*/
* {margin: 0;padding: 0;box-sizing: border-box}
body {font-family: Verdana, Arial;background: #F5F5F5;min-height: 100%;}
nav {
width: 90%;
margin: 100px auto 0 auto;
background-color: #666;
box-shadow: 0 15px 10px -10px rgba(0,0,0, .5)
}
nav ul {
direction: rtl;
}
nav ul li {
transition: all linear 300ms;
display: inline-table;
list-style: none;
border: 1px solid #444;
border-width: 0 1px;
border-left-color: #888;
background-color: rgba(255,255,255,0);
}
nav ul li:hover {
background-color: rgba(255,255,255,.5);
}
nav ul li a {
text-decoration: none;
color: white;
display: block;
padding: 10px;
}
Raw
dabblet.html
<!-- content to be placed inside <body>…</body> -->
<nav><ul><li><a href="#" title="Home">Home</a></li><li><a href="#" title="button 1">button 1</a></li><li><a href="#" title="button 2">button 2</a></li><li><a href="#" title="button 3">button 3</a></li><li><a href="#" title="button 4">button 4</a></li><li><a href="#" title="button 5">button 5</a></li></ul></nav>
Raw
dabblet.js
// alert('Hello world!');
Raw
settings.json
{"view":"separate","fontsize":"80","seethrough":"","prefixfree":"1","page":"all"}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment