Making all photos square via css

Question

I\'m trying to make a series of photos into square photos. They may be rectangular horizontally (i.e. 600x400) or vertically (400x600), but I want to get them to be 175x175 eit

Answer 1

You can set the width/height of the parent div then set the child img tag to width:100%; height: auto;

That will scale the image down to try to fit the parent with aspect ratio in mind.

You can also set the image as a background-image on the div Then if you can use css3 you can mess with the background-size property. It's attributes are: contain, cover, or a specificed height (50%, 50%) (175px, 175px) You could also try to center the picture with background-position