Sandipan Mukherjee• 180
@SandipanIO
Posted
For the images, I think you should use the picture tag.
<picture>
<source media="(min-width: 650px)" srcset="images/image-product-desktop.jpg">
<img src="images/image-product-mobile.jpg" alt="">
</picture>
The picture tag will now take care of the screen size/resolution. When the screen is 650px or more, the desktop version of the image will be used. When the screen size is less than 650px, the mobile version will be used. And all this will happen using pure HTML, without any CSS.
One more thing - Instead of using "width: 90vw", you can use min-height: 90vh for your container. Using 90vw is breaking your site in mobiles.
I hope this helps :)
0
