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

Stats preview card component

Milena 10

@milenamoreira

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


My first challenge 😄 Feedback is welcome!

Community feedback

@MojtabaMosavi

Posted

Hi, the mobile and desktop view are fine, but the between views need improvemnt. I suggest you spend some time reading about different workflows for writing styles.

Keep coding :)

0

Milena 10

@milenamoreira

Posted

@MojtabaMosavi thank you for the advice!

0
simon 130

@WebBoY7

Posted

try increasing your media query min-width... you have given width of 70rem to the card and change from mobile to desktop happend from 375px so try increasing the min width of media query so the card wont be bigger than the width of the screen

happy coding !

0

Milena 10

@milenamoreira

Posted

@stupid-simon thanks for the help, I'll fix it!

0
hao pham 745

@jerry-the-kid

Posted

Nice done. But for responsive you should add :

Card you can change to be like : width: 70rem => width: 85%; max-width: 70rem;

You should add width to 50% to class = 'information' and class = 'image-filtered'

And mobile you can change class = 'information' to width :100% and set box-sizing: border-box;

But there still many bug :v. But for beginner it ok. Keep try and make it perfect.

0

Milena 10

@milenamoreira

Posted

@jerry-carry thanks for the feedback, it really helped me! And yes, there is a lot of bugs, everytime I fix one another one appears haha

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