Skip to content
Submitted 3 months ago

Recipe Page Card Component

Jorge-234•110
@Jorge-234
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 challenges did you encounter, and how did you overcome them?

I completed the project quickly and faced no difficulties throughout the entire process.

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

Any feedback or suggestion are welcome ! Thanks

Community feedback

  • Boris•2,850
    @mkborisPosted 3 months ago

    Nice work @Jorge-234, here are some suggestions

    • Consider using the HTML Table element for the nutrition table instead of divs. This approach offers a better semantic structure.
    • All content should be wrapped within landmarks. Wrap a main tag around the .container and a footer for the attribution.
    • It's best practice linking Google fonts directly in the HTML head section rather than directly in your CSS file as it enables asynchronous downloading, improving page load times.
    • Consider using a modern CSS reset at the start of the styles in every project. Like this one Modern CSS Reset. This will help reset a list of default browser styles.
    • Font-size should be written in rem not px. This article explains it better Why font-size must NEVER be in pixels.

    Hope this helps, Good luck!

    1
    Jorge-234•110
    @Jorge-234Posted 3 months ago

    @mkboris
    Thank you very much for your insightful feedback. I truly appreciate your suggestions and am excited about the opportunity to apply them into my next project.

    0

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