Submitted 3 months ago

Recipe page using HTML/CSS

Ahmed• 80

@Ahmed-l2

Preview site(opens in new window)View code(opens in new window)

This is a solution for...

Recipe page

HTML
CSS

1newbie

View challenge

Design comparison

SolutionDesign

Solution retrospective

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

I'm proud of learning how to properly handle displaying your page with different screen sizes which I was totally unfamiliar with before I had started this project.

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

This project was a bit time consuming because it had a bunch of details that needed attention to get correct. And another challenge was how to get the page to display properly on mobile devices. This was new to me and figuring it out was an accomplishment.

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

I would appreciate any feedback, especially on the mobile preview of the page.

Community feedback

Ranit Manik• 880

@RanitManik

Posted 3 months ago

Unit Choice for Styling: Opt for using rem instead of px for properties like width, height, margin, padding, and font-size. This choice ensures better scalability and responsiveness, as detailed in this article.
```
/* Use rem for Better Scalability */
.container {
  width: 57.4375rem; /* Equivalent to 919px */
  height: 31.3125rem; /* Equivalent to 501px */
}
```

I hope you find my feedback helpful. Please mark it as helpful if you do.

Marked as helpful

Ahmed• 80

@Ahmed-l2

Posted 3 months ago

@RanitManik Will do in the future, Thank you very much for your feedback.

Please log in to post a comment

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