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 Stats Preview Card

@RobertoMada

Desktop design screenshot for the Stats preview card component coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


Hello guys, can you give me feedback about what can I improve or what Im doing wrong? I struggled with the size of the background image, I couldnt find a solution to display it better.

Community feedback

MICHAEL 150

@Generoustechnocrat

Posted

Hello ROBERTOMADA you did great but you just need to make little correction to get it right. Here is what i suggest you do. you need to create separate div for card and the image-container you also need to create a div container that holds both the image-container and card. you can use this properties to center your div: min-height:95vh; display:flex; flex-direction:row-reverse; align-items:center; justify-content: center; padding:10px; make sure you use the same width and height for image-container and card, width:440px; height:335px; border radius for the card is border-radius:9px 0 0 9px; while the border radius for the image is border-radius:0 9px 9px 0; I believe you are good with every other things. I hope you find this comment helpful. happy coding.

Marked as helpful

1

@RobertoMada

Posted

Thank you @Generoustechnocrat for the advices.

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