Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

Responsive preview card using Grid

Markewycz 60

@Markewycz

Desktop design screenshot for the Product preview card component coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


Some problems still occur but for now im done. I'll be pleased if someone point out better solutions. :)

Community feedback

P
Vivek 150

@tweetandcode

Posted

Two things, one of them I just learned yesterday, thanks to a comment.

  1. Start switching to mobile design at < 600px
  2. Use <picture> tag to load only one of the two images.

Hope this helped.

PS: The output looks good.

1

Please log in to post a comment

Log in with GitHub
Discord logo

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