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

Page responsive

@Maromani248

Desktop design screenshot for the Stats preview card component coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Community feedback

arey 350

@arey-dev

Posted

Congratulations on completing this challenge! but there is a slight issue in your code. Only the mobile design is visible.

Here is why: @media only screen and (min-width: 375px) and (max-width: 1440px)

you styled the mobile design in the between the range of 375px - 1440px width.

Maybe you just got confused a little bit. I know you can fix this issue right away, Happy Coding!

Marked as helpful

1

@Maromani248

Posted

@arey-dev oh, yes! Thank you for the advice!

0

@Maromani248

Posted

@arey-dev Sorry, but I can't fix these issue. I changed

@media only screen and (min-width: 375px) and (max-width: 1440px) to

@media only screen and (max-width: 1440px) but not working. Help me, please.

0
arey 350

@arey-dev

Posted

@Maromani248 set the max width to 612px. When setting max-width on media query, you are basically telling CSS to have certain styles up to certain screen size, which in this case, is the max-width:612px.

  • Try reading this this article for more information: Media queries
  • Or watch Kevin Powell on youtube. His channel focuses on CSS, you will surely learn a lot.

I hope this helps.

1

@Maromani248

Posted

@arey-dev oh, thank you so much! I've read and match those videos. Everything works for me.

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