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

Result summary with CSS and HTML.

Sevich-Kah 130

@Sevich-Kah

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


This is my first challenge and I have had a lot of trouble with my font. It works perfectly on other sites but when I post it on my submission page it does not seem to comply. I have checked the file path countlessly and even tried working with a external link font but none seems to work. Any feedback on the matter would be useful.

Community feedback

jubril 70

@Harkornde

Posted

Hi, I think you did try solving the desktop version; which is good. But my suggestion is that you could try designing for mobile first; this is because it'll help you use the media query more efficient, i.e you can go from mobile to tablet and then to desktop using the (@media (min-width: (size of your tablet)) and you can then set for desktop as well (@media (min-width: (size of your desktop)). The funniest is that you can use 2 or more min-width media in a code. you can read more on it here(https://www.emailonacid.com/blog/article/email-development/emailology_media_queries_demystified_min-width_and_max-width/)

Marked as helpful

0

Sevich-Kah 130

@Sevich-Kah

Posted

@Harkornde I've been working blindly since my laptop does not enable me to resize my browser window.

0
jubril 70

@Harkornde

Posted

@Sevich-Kah when you're on the browser, right-click your mouse, and it's going to show you some menu. Click on inspect and the developer tools will pop out. In it, you'll see one icon that looks like laptop click on it, and it's going to show you responsive design and with this you can inspect your code base on screen size.

1
Sevich-Kah 130

@Sevich-Kah

Posted

@Harkornde Thanks a bunch. I always had to copy my code to W3 school editor to see the media effects. This is truly helpful.

0
jubril 70

@Harkornde

Posted

@Sevich-Kah, You’re very welcome. I’m glad you found it helpful. 😊

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