Skip to content
Submitted 2 months ago

Recipe page challenge with basic html and css

Khai•80
@khlv2219
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 was very proud of recreating this design without any further help of external resources.

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

My biggest challenge was dealing with position/display properties of the table. I tried very long different properties and finally got the solution I wanted.

Community feedback

  • P
    David Lemvigh•200
    @dlemvighPosted 2 months ago

    Paise: You really nailed to desktop design (way more than I could be bothered myself).

    Comment: The mobile design seem to be missing, where the margin and border-radius is removed (among other things).

    Comment: Your use of css variables is pretty good. Except the font-weights --fw-1-400: 400; with this naming convension it ends up being a longer way of writing 400, and if you wanted to change the weights in the future you would end up changing the names to match.

    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