
Design comparison
Solution retrospective
Learning how to approach each section and layout my webpage properly. Would definitely do the font better and spend less time on it and improve on my tables
What challenges did you encounter, and how did you overcome them?I couldn't do the table width, can not overcome it(for now) I had issues with the font
What specific areas of your project would you like help with?How to design tables better How to work with external fonts My hr tag din't work
Community feedback
- @DangelobastPosted 9 days ago
Pretty close to the original design, but there are things to improve and this is the best part to learn. I will point to what things are most relevant for me:
-
Answering your question, your table doesn't fit your whole width because you are setting it to
display: flex;
and it will only take the necessary space, even if you set it to 100% afterwards. If you use your web developer tools and deactivate it then you will see it will occupy your whole width again, since is not behaving like a flex element, in other words taking only the necessary space. -
Didn't see any <hr> element in your code but sometimes when you don't set a width it doesn't work, so try setting a width to ensure it is occupying 100% of the space and see if that works for you.
-
You probably want to add some more padding to your top image and to your preparation time, and some of your subheadings as well as line-height where is need it to basically give some space to your text so it doesn't look crowded, for example your ingredients.
-
Your font-face looks fine, I would try to set the right colors and spacing and it will start to look similar, don't get too stressed about pixel perfect or making it look exactly the same just similar.
Hope this helps !
Marked as helpful0 -
Please log in to post a comment
Log in with GitHubJoin 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