Design comparison
Solution retrospective
I am new to programming and I might be a bit of a slow learner. I believe the only way to truly learn is by doing, so I have decided to do a little bit more doing instead of only learning.
I knew my solution would not be the best. I just wanted to get my hands on the keyboard and do some projects and make an attempt to at least get it to look like the design I was shown.
I still have a lot to learn and a lot of practicing to do. I don't seem to have a good grasp on the basics. I used margins, and flexbox, just buy guessing and trying to get it to look at least like the desktop design.
Searching things on the web have assisted me with that approach.
Some of the main resources that people use, such as "Font-awesome" is blocked where I am located now(China) so I had to search the web to find other resources for things such as icons, etc.
I will do better on my next project.
Community feedback
- @BarenbikPosted over 1 year ago
Hi.
You don't really need to use Font Awesome for the icons. In the project download you should see an assets folder which contains some svg files. You can link to these using the src attribute on the
<img>
element and it should use them as the icon. For example,<img src="../file_source_here" />
. Your solution works fine too. This is just in case you want to use the icons from the original design.Hope this helps. Good luck and keep going.
Marked as helpful0 - @AhmadIkhdairPosted over 1 year ago
Hello, don't stress you're doing great haha. I'm also new but slowly getting used to it. Also, I would suggest adding shadow as your card and background are the both white. Goodluck!
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