Skip to content
Submitted 7 months ago

Recipe Page - BA

soybrrraian•60
@imbraian
Preview site (opens in new tab)View code (opens in new tab)
This is a solution for...Recipe page
  • HTML
  • CSS
1newbie

Design comparison

SolutionDesign

Solution retrospective

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

I am proud of myself because I have been capable of finishing the project, even though it has been challenging for me to do so. Next time, I'd like to improve my abilities and learn how to use them correctly.

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

The challenges I encountered were primarily with tables because I had never worked with them before

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

I'd love to receive help with everything related to tables, flexbox and more (tips, semantics, etc).

Community feedback

  • Thomas Dimnet•250
    @tdimnetPosted 7 months ago

    Hi @imbraian,

    Very good job indeed!

    I saw you used css variables: it's really cool and professionial. The same goes for the BEM notation. However, you decided to use max-width instead of min-width. I tend to prefer the second one, it makes the approach for mobile friendly.

    For your table, I saw this:

    <p>The table below shows nutritional values per serving without the additional fillings.</p>

    You could use the caption tag instead. It makes tables more accessible, especially to screen-readers and assistive technologies. You can learn more about tables on the mdn: https://developer.mozilla.org/fr/docs/Web/HTML/Element/table

    Great job! Tom.

    1

Please log in to post a comment

Log in with GitHub

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