Geek asks and answers

How to make images crop

http://s1167.photobucket.com/user/unlivedgears/media/image-8.jpg.html?sort=3&o=1

http://s1167.photobucket.com/user/unlivedgears/media/image-9.jpg.html?sort=3&o=0

See In the first image, how girls and legs are cut off because the image is too long for the square. How can I make it cut off both of them and center them? Or, if it is too wide, will it cut off the sides?

+5
source share
1 answer

Assuming the HTML structure as follows:

<div>
    <img />
</div>

Use this css:

div{
    height: 100px;
    width: 80px;
    overflow: hidden;
}

img{
    min-height: 100%;
    min-width: 100%;
}

Or you can set the image as a background image and use background-size: cover

+7
source

More articles:


All Articles