Design comparison
Solution retrospective
Learned so many by working on this coding challenge
It was hard to handle the image and container to set and align them. By working on it by thinking much and by searching on google and discord It becomes easier. yeah, It waste time but It thought so much.
Community feedback
- @correlucasPosted about 2 years ago
๐พHello @Majid-Arab, Congratulations on completing this challenge!
You've uploaded your solution using
codepen
and this is nice. But this makes hard to us to analyze your code since this creates a lots ofaccessibility issues
if you look the solution report panel you'll see that you've ACCESSIBILITY ISSUES72
and HTML ISSUES93
. This error are not created due your solution, its due thecode pen
because the report comes from your page.My advice for you is to use
vercel.com
ornetlify.com
that are really easier platforms for live sites and totally user-friendly, in a matter of 5min your live site is online. All you need to do is to connect the Github account, import the repository and deploy it. Really fast.Fixing that you've to update the solution with the new link and we'll be able to see your live site and help you.
โ๏ธ I hope this helps you and happy coding!
0 - @MamoutyPosted about 2 years ago
Good job for you first challenge. I just have some remarks to help you make the solution more like the desired one: You need to deploy your website so that we can see it live, you can use github pages for example. Also be careful on the font, the paragraphs should have their own font, different form the header tags. You don't need to use a dive with class of main in this case, you just have to use the <main> tag instead, it's better for accessibility. At a certain break point, the width of the infoBox starts shrinking, this is due to the width being in percentages, it should remain the same until it actually reaches the desired breakpoint, let's say of 700px so that you change the flex direction without having to change the width before. A last remark is that the button should have a darker color on hover and the property cursor of value pointer.
0
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