Skip to content
Submitted about 2 months ago

Recipe Page Solution

Mustafa Sen•100
@mustafasen97
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 think I wrote the codes more regularly this time and I am quite happy with it. But I think I still have a lot to fix. Next time I'd like to make sure the codes are even more organized.

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

I can say that I had a little difficulty with the instructions. I figured this part out by doing some research.

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

In general, every feedback is very important to me. I'm open to comments.

Community feedback

  • Gracia Naimora Samosir•110
    @cia2003Posted 12 days ago

    Oke, I am impressed that you make the recipe page nearly pixel to the design one on desktop screen. You did great!

    I have some advice for you about the code.

    • At .image-container, you set the min-height and max-height to 300px. I suggest that you can add the property height with 300px value. And, I suggest you remove some properties like min-width = 100% because you already declare it on width property .So, here is the code:
    .img-container {
    height: 300px
    border-radius: 10px;
    width: 100%;
    box-sizing: border-box;
}
    Marked as helpful
    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