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 and CSS with Google Fonts

@JawadM2002

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?

Customizing the page, using the Google Fonts API to manage the fonts for particular texts, and maintaining structure. I have had fun using the semantic HTML aspects so that I can be able to specify which element is in which part of the HTML code, which was then beneficial for the CSS file.

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

The main issue I had was with how to place the text inside the main recipe box, but I have been able to overcome this by including the class name for each section, and then making the image is placed in the middle and to hide the overflow.

Community feedback

Sigma 40

@sigma-cmxi

Posted

colors

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