Clipboard Landingpage Responsive using CSS Grid and Flexbox

Solution retrospective
The thing I am proud of in this challenge is the minimal use of AI in overcoming the obstacles in creating this simple landing page. What I will do next time is that I will complete the challenges at my level quickly and get close to the design given.
What challenges did you encounter, and how did you overcome them?For the challenge, it's actually more about how to use the clamp property in CSS to use on width, etc. so that it is more responsive. To overcome this, I will ask AI to explain in detail but in a language that is easy to understand or maybe learn on YouTube
What specific areas of your project would you like help with?Maybe for friends who have more experience than me, can you please give input on the shortcomings of my landing page in this challenge. Thank you
Please log in to post a comment
Log in with GitHubCommunity feedback
- P@dar-ju
Hi, harizrifqy!
Great job! Good responsiveness, correct semantics.
- add a hover effect to your buttons, it's probably in the design layout
- I noticed how you work with indents, not quite right. Margin for indentation from other blocks should be used for blocks, not for their elements. For example, if you remove the "Download for Mac" button, your layout will break. Move the indent to the block.
Always think that this is not a static page, and something on it may change. Your task is to ensure that the layout remains stable when changing.
- you used the ul tag correctly in the navigation, but there are several more lists on this page - a list of social networks, a list of brands, a list of features.
- there are several errors in the html code, check the closing </img> tag for the logo, it has moved too far. In the ul list, nav has the wrong order of tags, it should be ul > li > a
Otherwise, everything is great, good luck with your projects!
Marked as helpful
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