Poner imagenes cuadradas en vez de rectangulas?

[Gloton]

Podria ser algo asi

Código HTML:

<div class="cuadrado">
  <img class="content"src="https://i.imgur.com/9Q9pgmR.jpeg">
</div> 

Código HTML:

.cuadrado {
  position: relative;
  width: 50%;
}

.cuadrado:after {
  content: "";
  display: block;
  padding-bottom: 100%;
}

.content {
  position: absolute;
  width: 100%;
  height: 100%;
  border: 5px;
}