Submitted almost 2 years ago

Using next js and tailwind css

Bartosz• 10

@bartoopl

Preview site(opens in new window)View code(opens in new window)

This is a solution for...

Product preview card component

HTML
CSS

1newbie

View challenge

Design comparison

SolutionDesign

Solution retrospective

I don't know how to add another photo to the mobile version.

Community feedback

Sebastian Arrieta• 270

@sarrietav-dev

Posted almost 2 years ago

Or you could use a media query with the background-image property.

This is the tailwind way to do it:

bg-[url('./image/*.jpg')] // For mobile

lg:bg-[url('./image/*.jpg')] // For desktop

Marked as helpful

Sinisa Vukmirovic• 1,690

@SinisaVukmirovic

Posted almost 2 years ago

Hello!

About your question, try using picture element

Try it, hope it helps!

Please log in to post a comment

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord