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 with semantic HTML

sofiasmnk 80

@sofiasmnk

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 feel like I'm getting more used to the workflow and being able to get through the steps more quickly. I still feel a bit lost when working with media queries, since I can get the results I want, but I'm never sure if I'm following best practices because I don't have a good framework for that yet.

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

Noticed that bold text looked way too bold in Safari compared to other browsers / how it's supposed to look. Apparently it's an issue with variable fonts, and Safari forcing fonts to be bold if they don't have a specific bold variant specified. Adding font-synthesis: none; to my reset seems to have worked.

What specific areas of your project would you like help with?

Like I mentioned earlier, probably about best practices with media queries?

Community feedback

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