Skip to content

Instantly share code, notes, and snippets.

@nielsdoorn

nielsdoorn/dabblet.css

Forked from koenveldhuizen/dabblet.css
Created February 18, 2012 08:18
Show Gist options
  • Save nielsdoorn/1858197 to your computer and use it in GitHub Desktop.
Save nielsdoorn/1858197 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%;
}
div.photo{
width:200px;
padding:10px 10px 40px 10px;
background: #fff;
box-shadow: 0px 0px 5px #000;
}
div.photo:nth-child(even){transform:rotate(2deg);}
Raw
dabblet.html
<!-- content to be placed inside <body>…</body> -->
<div class="photo"><img src="http://www.prelovac.com/vladimir/wp-content/uploads/2008/03/example.jpg" width="200px" /> </div>
<div class="photo"><img src="http://www.prelovac.com/vladimir/wp-content/uploads/2008/03/example.jpg" width="200px" /> </div>
<div class="photo"><img src="http://www.prelovac.com/vladimir/wp-content/uploads/2008/03/example.jpg" width="200px" /> </div>
<div class="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":"html"}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment