Crop image in CSS

Question

I\'ve created a two-column grid of images, which works fine with all-landscape images: Link. However, I\'ve added a portrait image that throws off the layout, so I\'d like t

Answer 1

You can use CSS3 to handle this very elegantly in a single div without any extra containers :

.portrait-crop {
    width: 300px;
    height: 100px;
    background-size: cover;
    background-position: center;
}