Crop Image with CSS
A simple question, have you ever wanted to crop an image using CSS? Well here’s the answer, clip: rect(). It’s quite easy to do with jQuery and PHP but this is a great and easy option for all those little gallery thumbnails.
Demo:
HTML:
<img src="images/example.jpg" class="example" alt="also example">CSS:
.example {
position: absolute;
clip: rect(30px 350px 270px 50px);
}Note that the coordinates for cropping all start from (0,0) and that the syntax is rect(topline rightline bottomline leftline).
