Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

Recipe page using html + css + bem + sass

P
yoyov51234 240

@yoyov51234

Desktop design screenshot for the Recipe page coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


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

  1. Keep to try even though it was hard.
  2. Pay attention on the divs which css should be affecting.

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

  1. For the list, the height is not the original one, I put some margin-bottom for each li
  2. For the list, the bullets have some space between the text, I used padding-left for the li so that there will be space
  3. Using tailwind, sometimes the config doesn't apply, I don't know why and haven't figured it out.
  4. There are a lot of duplications on the styles
  5. When there's no padding , the li marker won't show.

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

Any feedback on the improvements

Community feedback

@aaditamanugraha

Posted

Hi yoyov!

your code are already nice, but maybe you can pay attention more to style because as a front end it's very nice if you can stay same as the design. You can see the style-guide.md file at the challenge file to find the right color for your code.

Happy coding and keep grinding everyday!

Marked as helpful

0

P
yoyov51234 240

@yoyov51234

Posted

@aaditamanugraha Thank you for the comments. Regarding your comment, I checked again on the design, changed the font color of Nutrition table. I also made some gap changes for the tables, it's now better than before. : )

If possible, could you please help point out the differences directly next time, since sometimes i dindn't notice the differences : (, Thank you very much for your inputs!

0

Please log in to post a comment

Log in with GitHub
Discord logo

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