Skip to content
Submitted 4 months ago

Recipe Page using HTML and CCS only

Rui-Martins23•170
@Rui-Martins23
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?

Pleased that I managed to make it very similar to the goal, since the HTML structure wasn't the simplest for me. Also the styling of some elements proved challenge at first, in order to rendered them as in the challenge solution. However, I think the outcome is positive.

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

Styling the Preparation Time box and the sections below weren't easy, as I had to make some research in order to style the bullet points of the and elements. But in the end, it actually wasn't that difficult with the use of the pseudo class ::marker

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

How would you do the Nutrition Section of this challenge? When making it, I felt this could be made in many different forms... which makes me think mine isn't the best.

Community feedback

  • Krushna Sinnarkar•1,100
    @krushnasinnarkarPosted 4 months ago

    Hi @Rui-Martins23,

    Congratulations on successfully completing the challenge!

    Your solution looks nice, though there are a couple of things you can improve, which I hope will be helpful:

    The nutrition section can be improved by using a table instead of ul and hr. Creating a table with 4 rows and 2 columns, using only bottom borders, and aligning the text to the left would be more appropriate for displaying structured data. If you’re unfamiliar with tables, you can check out W3Schools or MDN Web Docs for a comprehensive understanding.

    I hope you find this helpful.

    Feel free to reach out if you have more questions or need further assistance.

    Happy coding!

    Marked as helpful
    0
    Rui-Martins23•170
    @Rui-Martins23Posted 3 months ago

    @krushnasinnarkar Hi Krushna, Thanks for your feedback! After consulting the links sent, i will definitely have in mind the use of the HTML tables next time. They would actually make the Nutrition Section html composition much more easy.

    Thank you once again for the help!

    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