Understanding images and scaling

Hi, I have some problem understanding how images scale.

What I want is some images on a page to never go over 100vh.
So my thought was to make a div max 100vh and then put two images inside the div. But they don’t care about the div :stuck_out_tongue:
Then makeing images max 100vw and max 100vh doesn’t work because they then get distorted.
What am I not understanding? :slight_smile:

Here is my public share link: LINK
(how to access public share link)

I am not sure I understand your question entirely, but you can use percentages in place of vh for the images. So in this case if you set the images width to 50%, and height to 100%, they will fill both fit in horizontally and fill in vertically. I hope that answers your question!! If not let me know and I will try to clarify! :slight_smile:

Cheers!

Thanx @Hamilton :slight_smile: But when I make a DIV and set it to max 100vh, and add a image into that div. if the image is bigger then the screen, it still goes over the “border” of the div. And even if I set the image to MAX 100% nothing happens.

Why won’t the DIV and image respect my authoritah!!

hmmm can you share your public link?

I figured it out. It was just my lack of understanding.
Sorry for the trouble :slight_smile:

1 Like

This topic was automatically closed 60 days after the last reply. New replies are no longer allowed.