Соотношение сторон 16/9 при максимальной высоте?

Question

Как я могу получить значение максимальной высоты для content div и как я могу получить высоту / ширину 16/9 для img во фрагменте ниже?Я хочу, чтобы содержимое масштабировалось до 720px в высоту.

Есть ли лучший способ, чем использовать padding 56.25% для этого?Я предполагаю, что нет значения max-padding.Кроме того, есть ли что-то в css, например, vh / vw, но для элемента содержимого, где я могу установить 56,25%, если это имеет смысл?

Кроме того, в моем браузере (по крайней мере, Firefox) изображение в настоящее время получаеттакая же высота как ширина, если изображение не найдено, так как высота не установлена.

.container {
  width: 50%;
}
.content {
  border: 1px solid red;
  width: 100%;
  padding-top: 56.25%;
  position: relative;
}
img {
  width: 100%;
  position: absolute;
  top: 0;
  left: 0;
  border: 1px solid blue;
}

<div class="container">
  <div class="content"><img src="false-url.png" /></div>
</div>