Skip to content
Submitted 3 months ago

Recipe Page

AKdeBerg•160
@AKdeBerg
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 careful of using the proper HTML tags. I studied which tags to use for which case and tried to use them appropriately rather than using all the time. I studied tags from https://developer.mozilla.org/en-US/docs/Web/HTML/Reference

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

I design for table using CSS was bit hard and customizing the list put me through some challenge.

What specific areas of your project would you like help with?
  • Plz let me know if I can improve anything about tags.Did I use appropriate tags?
  • Is there anyway my css could be better?

Community feedback

  • Joshtemi0•180
    @Joshtemi0Posted 3 months ago

    Great Job

    .card {
  background-color: hsl(0, 0%, 100%);
  width: 38%; 
  overflow: hidden;
  padding: 2%;
  border-radius: 15px;
}

    I will advise you to stop using percentage for you side it should be in px, rem, em etc because it will be 20% of every screen size. So try changing it to px, rem ...

    And use midea query also for mobile sizing

    Hope this helps

    Marked as helpful
    1
    AKdeBerg•160
    @AKdeBergPosted 3 months ago

    got it bro! thanku so much @Joshtemi0

    0
  • Joshtemi0•180
    @Joshtemi0Posted 3 months ago

    Great Job

    .card {
  background-color: hsl(0, 0%, 100%);
  width: 38%; 
  overflow: hidden;
  padding: 2%;
  border-radius: 15px;
}

    I will advise you to stop using percentage for you side it should be in px, rem, em etc because it will be 20% of every screen size. So try changing it to px, rem ...

    And use midea query also for mobile sizing

    Hope this helps

    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