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 using html and css

@balaji282004

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 think i can finish this mini project over a short time than before

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

not that much but while doing i have little issues in flex box

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

i think someone can check it for over size of the container

Community feedback

@marliedev

Posted

Well the Screenshot looks good, but the solution is not responsive! Work with relative sizes! The only fixed size for this project you have to set is a max-width for the container (736px). Everything else inside the container should be adjusted in dependence of the container width.

Improvements:

  • move the styles out into a external css-file
  • find similarities and create global styles (e. g. you dont need a content1/2/3/.. class for every section. The base styles (padding, margin, lineheight, font/text styles could be set up in a "recipe__section"-class)
  • Improve readability and structure (naming of classes, BEM-Methodology, semantic HTML -> figure, section, main, headline hierarchy)

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