Как сделать зависимость высоты от ширины для резинового блока?

Question

[Yapryntsev]

Есть резиновый в ширину блок, как сделать зависимость высоты этого блока от его ширины, что бы они были равны?

Answer 1

[monochromer]

Например, так

/**
 * [1] - регулировка размера контейнера
 * [2] - изображение растягивается по контейнеру
 */
.block {
  position: relative;
}
  .block:before {
    content: "";
    display: block;
    width: 100%;
    padding-top: 100%; /* [1] */
  }
    /* [2] */
    .block__img {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
    }

Answer 2

[NickBetali]

body, html {
height: 100%;
}
div {
width: 30vw;
height: 30vw;
background: #000;
}