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
Desktop design screenshot for the Recipe page coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Community feedback

@begli-amanov

Posted

Hi @MdZaferEqbal, nice job here. With a bit tweak you could make your solution closer to the original design of the recipe. Here are some:

  • Increase padding of recipe-page-content-container from 10px to about 30-40px.
  • font-style: normal; is usually the default one if you haven't set it differently, so you might lose this property
  • I would also suggest to increase the width of the container a bit. to around 50%
  • Adding a <main> tag after line 36 in your HTML file will improve accessibility of your page. If you would like to know more about the <main> tag.
  • Lastly I suggest you to download the necessary fonts and host them on your own. This will improve your page's performance in a long way.

However I do really like how your recipe looks like and wishing you a lot of fun in the future. Good job!

Marked as helpful

0

@MdZaferEqbal

Posted

@begli-amanov Thanks for the feedback I will be updating these in the repo and I will download the fonts for this challenge and in future.

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