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 @media query for responsiveness

TheAashay 210

@TheAashay

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?

Proud that made it in less time than I estimated and I'll arrange the CSS properties properly while using comments to understand the workflow better.

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

Encountered challenges while spacing elements, developer tools from browser were helpful for seeing where paddings and margins are currently used and when to add or remove them.

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

I'll revise the sizes of the content a while later, so do not need any help with it.

Community feedback

P

@amjadsh97

Posted

nice job! Continue!

1

@imranhossainemi

Posted

Nice try, you did many thing right and worng. Try Follow html structure semantics for accessibility and navigation screen readers. Also the recipe nutrition part can be formated by table tag element, it is easy to manage while designing the page.

1

TheAashay 210

@TheAashay

Posted

Thanks for writing this review. I saw some other guy's solution earlier and that too gave me idea to implement table elements. @imranhossainemi

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