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

Results summary component using grid and media queries

@ElijahPlushkov

Desktop design screenshot for the Results summary component coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


Hello! My questions are:

  1. Do I use the media-queries correctly?
  2. How can I improve on using them?

Community feedback

@rohmatsetiawanmta

Posted

Hello.. I have some feedbacks to your solution..

Font Family

It seems like the font family is not showing up in the preview. Here is one way you can try to ensure the font family is displayed in the preview. You can add the following code to the first line of your CSS file.

@import url('https://fonts.googleapis.com/css2?family=Hanken+Grotesk:ital,wght@0,500;0,700;0,800;1,500;1,700;1,800&family=Space+Grotesk:wght@500&display=swap');

Padding

It would be better if the 4 section in summary sections and the continue button are given more padding. Adding padding can give a neater impression because it's not too close to the border.

But, this is a very good start! Good job!

Marked as helpful

0

@ElijahPlushkov

Posted

@rohmatsetiawanmta Hello! Thank you very much for your feedback! I have already inspected your code -- i hope you don't mind -- and compared it to mine. I noticed the very first line and thought of it to be a good addition to my initial code. Thanks again!

0

@rohmatsetiawanmta

Posted

@ElijahPlushkov Yes, no problem. Keep going!

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