|Subject:||Response div maintaining aspect and always visible|
|Posted by:||Andrew Poulos (ap_pr…@hotmail.com)|
|Date:||Mon, 9 Nov 2020|
A need a div to be responsive, to maintain its aspect ratio and to
always be completely visible within the viewport.
A search turned up CSS like this
padding-top: 56.25%; /* 16:9 ratio */
with this HTML
Alas it only works so long as ratio of the browser window is bigger
than, in this case, 16:9.
That is, when the browser window isn't tall enough I get scrollbars.
Ideally wrap's height (and width) should shrink to so that wrap never
extends beyond the viewport. How is this possible in CSS?