Skip to content

Instantly share code, notes, and snippets.

Created May 18, 2013 21:48
Show Gist options
  • Save anonymous/5605890 to your computer and use it in GitHub Desktop.
Save anonymous/5605890 to your computer and use it in GitHub Desktop.
Untitled
p#nav {text-align:justify;background:#48a;box-shadow:0 0 15px white;border-radius:5px;
margin:3em 1em;paddin:0;line-height:0;
overflow:hidden;position:relative;}
a {color:white;margin:0 1em;padding:0;display:inline-block;text-align:center;vertical-align:middle;
background:radial-gradient(rgba(255,255,255,0.1) , rgba(0,0,0,0) 1em);
transform:rotate(0deg);
transition:1s;
min-width:5em;min-height:5em;line-height:5em;
}
img {vertical-align:middle;}
#nav i {display:inline-block;width:100%;height:5em;margin:-5em 0 0;padding:0;vertical-align:top;
background:linear-gradient(0deg, #48a ,#159,#48a);}
a:hover ,a:first-child {transform:rotate(3600deg);transition:0.5s;
background:radial-gradient(rgba(255,255,255,0) 0.25em,rgba(0,150,200,1) 1.5em, rgba(255,255,255,0) 1.75em , rgba(255,255,255,0) 2em);}
html{background:#333;
<p id="nav">
<a href="#"><img src="http://upload.wikimedia.org/wikipedia/commons/d/dd/Farm-Fresh_house.png" /></a>
<a href="#"> tagada </a>
<a href="#"> tsouin tsouin </a>
<a href="#"> le marsoin </a>
<a href="#"> dans </a>
<a href="#"> lo lololo loo </a>
<i></i>
</p>
// alert('Hello world!');
{"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