Skip to content
Submitted 9 months ago

mobile-first Recipe page

RichardTagoe•70
@RichardTagoe
A solution to the Recipe page challenge
Preview (opens in new tab)Code (opens in new tab)

Solution retrospective

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

This time I was able to make my webpage a little more responsive. I was also able to learn how to use Dev tools to help you make your webpage more responsible. Next time i will try to make my CSS code a little more consice.

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

When I finished the work, I found out that my work when displayed on my own laptop was very different from what I was anticipating because I didn't use my screen but rather the chrome dev tools through out the work. i don't know if what I did is correct, though.

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

I would like if someone is able to check if my work is responsive and explain to me why my work appeared different on my desktop from what I used

Code

Please log in to post a comment

Log in

Community feedback

  • Jani-B•370
    @Jani-B

    Hello,

    From my opinion the responsiveness works just fine. and the design looks good. Great work :)

    I am not 100% sure why you used so huge fonts on this one. but the design itself and the responsiveness were good. Also you were wondering why your work looked different on your desktop. Maybe you had zoomed on the page? I noticed that the page looks a lot different if you zoom the page - so maybe that is the reason?

    Just a hint for the fonts and other sizes -> you can also check our how to use rem instead on px. it works in many situations better.

    Only thing i personally (just my personal opinion) would change is the inline css in the index.html. I think it is fine as it is but if you would create a bigger project and you use .css file and also add css in the HTML file - it might get confusing if you get back to the project later and want to change some css.

    But I think you code was very clean and easy to follow. ! nice one :)

    Marked as helpful
  • RichardTagoe•70
    @RichardTagoe

    Please I wanted to ask a question. You see, when taking a challenge, you are given three designs. are we to choose any of them to design, or when we design them, they are supposed to look like the three modes i.e desktop, mobile and active mode?

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