Skip to content

Instantly share code, notes, and snippets.

@koenveldhuizen

koenveldhuizen/dabblet.css

Created February 17, 2012 22:12
Show Gist options
  • Save koenveldhuizen/1855731 to your computer and use it in GitHub Desktop.
Save koenveldhuizen/1855731 to your computer and use it in GitHub Desktop.
Download ZIP
Very simple css3 polaroid styling
Raw
dabblet.css
/**
* Very simple css3 polaroid styling
*/
body{
background: #f06;
background: linear-gradient(45deg, orange, yellow);
min-height:100%;
}
#photo{
width:200px;
padding:10px 10px 40px 10px;
background: #fff;
box-shadow: 0px 0px 5px #000;
}
#photo:nth-child(even){transform:rotate(2deg);}
Raw
dabblet.html
<!-- content to be placed inside <body>…</body> -->
<div id="photo"><img src="http://www.prelovac.com/vladimir/wp-content/uploads/2008/03/example.jpg" width="200px" /> </div><div id="photo"><img src="http://www.prelovac.com/vladimir/wp-content/uploads/2008/03/example.jpg" width="200px" /> </div>
<div id="photo"><img src="http://www.prelovac.com/vladimir/wp-content/uploads/2008/03/example.jpg" width="200px" /> </div>
<div id="photo"><img src="http://www.prelovac.com/vladimir/wp-content/uploads/2008/03/example.jpg" width="200px" /> </div>
Raw
settings.json
{"view":"separate","prefixfree":"1","page":"css"}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment