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

Responsive Results Summary Components with position property

@Priyanshu-WD

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


Hey, please correct me, if I am wrong somewhere.

Any output will be highly appreciated!

Community feedback

@ratul0407

Posted

@PriyanshuPrama12 congrats on completing this awesome project.😀😀

You've done a really great job. But you might consider changing some codes:

  • Each page should contain a level one heading <h1>. So you can replace the text your result from <h6> to an <h1>.
  • You've used position relative on your #section__box--circle to place the <h2> and <p> underneath it. Well if you have a good grasp on position tag and you are comfortable with positioning elements there is nothing bad about using it. But in this example you clearly don't need to position it. You can just use a div and and then .section__box1 will have three child elements inside of it and you can just use
.section__box1 {
  display: flex;
  flex-direction: column;
  gap: 2rem; //or whatever you feel matches the design better🌝
  }

In this way you don't have to write that much of code and don't have to add that much complexity in your code.

I hope that helped🌝🌝

Keep up the good work

Marked as helpful

1

@Priyanshu-WD

Posted

Thank you @ratul0407, looking to my code, and for the suggestion!

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