I'm having a bit of a hard time working with aspect ratios.
I am designing a tablet portion for my webpage.
On the main page I have an image slideshow.
The slideshow is responsive and changes size according to the tablet being in horizontal or vertical view.
I would like for the slideshows containing div to maintain an aspect ratio but also be responsive.
The aspect ratio I am trying to use is the size of a Facebook cover photo.
The dimensions of the photos are 851px wide and 315px tall.
I was doing some searching on SO and found:
width: 100vw;
height: 56.25vw; /* height:width ratio = 9/16 = .5625 */
I am having a hard time coming up with the math to keep the aspect ratio of a photo of those dimensions the same but responsive.
Biggest thing I cannot figure out is if my width is width: 100vw; then what would my height be to keep the proportions?
EDIT: Not a duplicate, my question is pertaining specifically to how to do the math to find the aspect ratio of specific dimensions using a specific method which IS NOT listed in the "duplicate questions" answers.
