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

Recipe Page

@Veracruzjw

Desktop design screenshot for the Recipe page coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


What are you most proud of, and what would you do differently next time?

I mastered the use of ul and ol

What challenges did you encounter, and how did you overcome them?

Changing the li's bullets and numbers to a different color to the values. I made use of the ::marker pseudo-selector.

Community feedback

geomydas 1,060

@geomydas

Posted

  • The solution is almost similar to the design, good job!

  • Don't skip heading levels. This line of your code violates it <h5>Preparation time</h5> You can learn more about it here

  • The HTML is fine for me but I'd suggest wrapping all of the other elements except for the body and html with a <main> tag and remove the <section> tag and instead use it per section in the recipe page for better semantic HTML. You should remove all of the divs and replace it with a section tag. For the first div, apply the styles directly to the <main> element so your HTML is cleaner

Marked as 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