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

Product-preview-card-component

Arunkumar 210

@apy1412

Desktop design screenshot for the Product preview card component coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Community feedback

Hassia Issah 50,670

@Hassiai

Posted

Replace <section class="container"> with the main tag and <div class="attribution"> with the footer tag to make the page accessible. click here for more on web-accessibility and semantic html

For a responsive image that will change the images at different screen sizes use the picture tag. For more click here

To center .container on the page using grid, replace the height in the body with min-height: 100vh.

You forgot to give .container a border-radius value.

Hope am helpful.

Well done for completing this challenge. HAPPY CODING

1

Arunkumar 210

@apy1412

Posted

thanks@Hassiai

0

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