Need to have two different image sections; one for desktop, one for mobile

Site URL: https://www.stuffbystink.com

Hi 🙂

Need to find a way to have ONE image show up on desktop only, and then ANOTHER image show up for mobile only.

I want to have this image for desktop:

and this for mobile:

I currently have this for both (it just looks too small on mobile and doesn't work very well):

I'd also love to be abole to add a bit more padding / width on the sides of the desktop image to decrease the image overall size? (but maintain the actual image itself / no crop)

Thankyou!!!!

8 minutes ago, isobeleastwood said:

Site URL: https://www.stuffbystink.com

Hi 🙂

Need to find a way to have ONE image show up on desktop only, and then ANOTHER image show up for mobile only.

I want to have this image for desktop:

and this for mobile:

I currently have this for both (it just looks too small on mobile and doesn't work very well):

 

I'd also love to be abole to add a bit more padding / width on the sides of the desktop image to decrease the image overall size? (but maintain the actual image itself / no crop)

 

Thankyou!!!!

 

I think we can create 2 sections with different images. After that, using media query to set one section only show on mobile and the another one is always display on mobile.

Reference: https://www.w3schools.com/css/css_rwd_mediaqueries.asp