

表題の通りです。  
例えば2：3のボックスを表示したいとして  
縦横比を維持したままブラウザの横幅に合わせてサイズを変更させることは簡単にできますが  
ブラウザの高さによっては画面に入りきらずスクロールバーが出てきてしまいます。

そうではなく、`background-size: contain;` のように  
縦横比を保持して表示領域に収まるようにブロック要素を表示させたいです。  
このような表示は可能なのでしょうか？

色々試したり検索してはみたのですが、前者の情報しか出てこないので  
方法があればご教授いただけたらと思います。よろしくお願いいたします。


CC BY-SA 4.0
2018-06-25T15:36:58.313
45062
2019-12-09T01:15:02.437
2019-12-09T01:15:02.437
32986
29067
question
jquery css
縦横比を保持して、表示領域に収まるようにブロック要素を表示したい


[object-fit: contain](https://developer.mozilla.org/ja/docs/Web/CSS/object-
fit)と必要に応じたmax-heightを使えば実現できる気がします.


CC BY-SA 4.0
2018-06-26T13:06:09.880
45090
2018-06-26T13:06:09.880
12216
45062
answer