Skip to content
Submitted 3 months ago

Simple Recipe Page

Luís Felipe Passamani Santos•10
@passamanii
A solution to the Recipe page challenge
Preview (opens in new tab)Code (opens in new tab)

Solution retrospective

What are you most proud of, and what would you do differently next time?

I've made it.

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

I really strugled to finish this project, even that this is a Newbie diffuculty one. I'm happy to say that despite the challenges and the over time spent, you can learn new things and get better every single day. Believe in yourself. And count on some other people to help you through the way. Peace.

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

Html and mostly Css learning and developing.

Code

Please log in to post a comment

Log in

Community feedback

  • Agata Liberska•4,075
    @AgataLiberska

    Hi, I think visually your solution looks pretty good but I think things could be improved in your HTML and css. Firstly, your recipe card shouldn't really be using <main> as the wrapper, you should have an <article> tag in there (inside the <main>, not instead of it). You could also use <section> tags inside the article for the ingredients list, instructions etc.

    With your CSS, with your next challenge, I would start with looking over the design to see what styles are repeated throughout.

    For example, here we have a <h2> which is used 3 times and they visually look the same, but you're removing the default margins in your reset and apply different padding-bottom to each of them to make them look the same. Also we have two <hr> which have different styles - again to make them look the same. These are just examples but it overall seems like a chunk of your styles is just overriding the styles you set earlier and it's just unnecessary I think - have a look over to see if you can simplify things. Don't worry though, this is something that definitely comes with practice!

    Marked as helpful

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