Geek asks and answers

Re size of various images without distortion

All images have one thing in common; they all have a width of 300 or 600 pixels. But the height ranges from 300-900 pixels. Now I need a small group of images to be used to offer other images to the user. It will be only about 100x200 pixels (may change). My previous attempt made images compressed at a ratio of 100x200. I need it to overlap, but the excess is hidden.

+3
source share
2 answers

Try something like this http://dabblet.com/gist/2769112

CSS you just need

.img-container {
    width: 200px; /* whatever set width */
    height: 100px;
    display: inline-block; /* or you could float them */
    overflow: hidden;
}
.img-container img {
    width: 100%;
}
+8
source

, DIV, overflow:hidden.

0

More articles:


All Articles