Unresponsive images

Design help General
1

When my site is in desktop mode the images are perfectly formatted, but when I scale it to tablet or mobile the images become skewed.
1538×1274 1.06 MB

2160×1344 1.5 MB

Here is my public share link: https://preview.webflow.com/preview/becca-s-marvelous-site?preview=abcec9261da4bffa48deae7d757ab6ee
([how to access public share link][2])

2

Try setting the heights of your images to auto:

1409×590 312 KB

3

But I want the images to be the height and width they are. Is there anyway to do that and maintain the img proportions?

4

How about div with background-image?

1 Like
5

The images are nested in devs, but even still they are skewed. What can i do to fix this?

6

Yes! There is a way @Becca_Urry. Try using VW measurements for the width of the image and then for the height also use VW and size it so that it will fit the whole image. After that you are set. :sunglasses: This way the image can resize according to browser size but it will always include the whole image and be the same shape throughout.

Let me know if you need any help on this topic. :wink:

1 Like
7

this is helpful, but what are vw measurements?

8

You can find it here <length> - CSS: Cascading Style Sheets | MDN

9

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