Streaming live at 10am (PST)

Different images for desktop and mobile


Hi! I have a quick question.

First here is my read-only site:

If you go to the ‘For Customers’ page, in the ‘How it works’ section you will see three mockups with steps. For desktop I would like to keep it that way but if you change to mobile, I would like that the mockups are half shown, cut like you can see here . So, still one step on top of each other but with a shadow effect below like I currently have for the different sections in the page.

I was wondering if It’s possible to upload different images for desktop and mobile so that I can upload a cut version for mobile, keeping the full for the rest of the devices.

Or is there any other simpler way to achieve this? Also considering that I would somehow need a shadow effect below each cut image.

Looking forward to hearing from anyone! Have a nice one!

Here is my site Read-Only: LINK
(how to share your site Read-Only link)


Rather than having 2 sets of images, you should just use the ones you already have and cut them using overflow:hidden.

When you have a very diffferent design for desktop and mobile, using the same assets, don’t hesitate to design 2 sections and make them visible only for one device. So one section designed for desktop, one for mobile, and you swap the visibility using display:none.


Clear! Will try this, thanks vincent!