How to make square images?

Question

css

It is necessary to make square images
PS all images have a different size, both vertical and horizontal, if you set the same width and height, the picture is stretched

<a class="example-image-link" href="http://lokeshdhakar.com/projects/lightbox2/images/image-3.jpg" data-lightbox="example-set">
  <img class="example-image" src="http://lokeshdhakar.com/projects/lightbox2/images/thumb-3.jpg" alt=""/>
</a>

Answer 1

Если пропорции не совпадают, то можно
1. растянуть
2. обрезать
3. повторять картинку
4. дополнить фоновым цветом/изображением.

Answer 2

А если картинке задать object-fit: cover;

Answer 3

Обычно делаю квадратный блок через padding-bottom: 100%; и вывожу изображение фоном с background-position: center; background-size: cover;

Answer 4

Грамотней всего обрезать через PHPthumb.