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

First responsive page using HTML & CSS

Alex• 270

@chillcodemao

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


I presume my solution is about right (by comparing to the design). In this case my question would be: is there a more efficient way to code this responsive page? P.S. I am new to Github and how it works - I learned the basics for this exercise.

Community feedback

P
Jaydi• 355

@ruedasjnthn

Posted

You can use percentage or viewport width to make consistent margin as the screen size is reduced

Marked as helpful

0
Vanza Setia• 27,855

@vanzasetia

Posted

👋Hi Alex! My name is Vanza!

For your question, in my opinion yes there is more efficient way to code this solution, but my question for you is that, what kind of efficiency part that you want to know? Best practices, the HTML or the CSS?

Try to give padding to your body style on mobile screen size (<400px width), since right now the card fill the entire screen of my phone.

You can use background-blend-mode: multiply, for the purple overlay.

Since you're new to Git and GitHub, you can try to learn Markdown, so your README.md file would be much better.

That's it! Hopefully this is helpful!

Marked as helpful

0

Alex• 270

@chillcodemao

Posted

@vanzasetia hi, nice to meet you. Thanks for the feedback, it's very welcome. I'll check your suggestions to find out more, thanks for the tip with markdown.

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