Now with superpowers
By default there is no rotation but you can use the trf-r modifiers to define it.
<div class="box-none ta-c">
<!-- Image polaroid with rotation -20deg -->
<img src="../static/img/chuck.jpg" class="image-polaroid trf-r--20" width="150" />
<!-- Image polaroid with rotation -10deg -->
<img src="../static/img/chuck.jpg" class="image-polaroid trf-r--10" width="150" />
<!-- Image polaroid default -->
<img src="../static/img/chuck.jpg" class="image-polaroid" width="150" />
<!-- Image polaroid with rotation 10deg -->
<img src="../static/img/chuck.jpg" class="image-polaroid trf-r-10" width="150" />
<!-- Image polaroid with rotation 20deg -->
<img src="../static/img/chuck.jpg" class="image-polaroid trf-r-20" width="150" />
</div>
By default there is no rotation but you can use the trf-r modifiers to define it.
<div class="box-none ta-c">
<!-- Image polaroid with rotation -20deg -->
<a href="#" class="image-polaroid trf-r--20">
<img src="../static/img/chuck.jpg" width="120" />
</a>
<!-- Image polaroid with rotation -10deg -->
<a href="#" class="image-polaroid trf-r--10">
<img src="../static/img/chuck.jpg" width="120" />
</a>
<!-- Image polaroid default -->
<a href="#" class="image-polaroid">
<img src="../static/img/chuck.jpg" width="120" />
</a>
<!-- Image polaroid with rotation 10deg -->
<a href="#" class="image-polaroid trf-r-10">
<img src="../static/img/chuck.jpg" width="120" />
</a>
<!-- Image polaroid with rotation 20deg -->
<a href="#" class="image-polaroid trf-r-20">
<img src="../static/img/chuck.jpg" width="120" />
</a>
</div>