Skip to content

Instantly share code, notes, and snippets.

@koenveldhuizen
Created February 23, 2012 12:57
Show Gist options
  • Select an option

  • Save koenveldhuizen/1892703 to your computer and use it in GitHub Desktop.

Select an option

Save koenveldhuizen/1892703 to your computer and use it in GitHub Desktop.
Luc made me do it :-)
/**
* Luc made me do it :-) */
body{
background: #f06;
background: linear-gradient(45deg, #FFF, lightblue);
min-height:100%;
}
body div{
width:900px;
margin:100px auto;}
ul {
margin:0;
padding:0;
list-style-type:none;}
ul li{}
ul li a{
display:block;
padding:10px 20px;
float:left;
border:5px solid grey;
border-radius:10px;
background: lightgrey;
margin:0 10px;
text-decoration:none;
transition: transform 0.3s ease;
}
ul li:nth-child(1) a{
background:lightgreen;}
ul li a:hover{
transform:scale(1.25) rotate(30deg);}
<!-- content to be placed inside <body>…</body> -->
<div>
<ul>
<li><a href="#">een</a></li>
<li><a href="#">twee</a></li>
<li><a href="#">drie</a></li>
<li><a href="#">vier</a></li>
<li><a href="#">vijf</a></li>
<li><a href="#">zes</a></li>
<li><a href="#">zeven</a></li>
<li><a href="#">acht</a></li>
<li><a href="#">acht</a></li>
</ul>
</div>
{"view":"split","seethrough":"","prefixfree":"1","page":"html"}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment