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

Using HTML and CSS

@kushank1207

Desktop design screenshot for the Clipboard landing page coding challenge

This is a solution for...

  • HTML
  • CSS
2junior
View challenge

Design comparison


SolutionDesign

Community feedback

Shashi Lo 1,345

@shashilo

Posted

From a glance, this looked really good Kushank. But when I compared it to the design, here are the areas of improvement I noticed:

  • Font sizes, font weight, line height, font color, in varies places are off. For example, the hero's heading font size is too small.
  • The style guide calls for a max-width of 1440px. You do not have this set at all. It looks like the development is contained, but that's because the content isn't long enough to fill the entire screen. If you look at where the paragraphs break, you'll see how wide each section should be.
  • The buttons are missing a drop shadow and bottom border. These are subtle features, but features that cannot be missed or the designer will yell at you. :)
  • For this page, I would recommend you use classes instead of Id's. Reusability will be better with classes and I hardly use Id's unless I have to for anchor points.
  • Try to avoid classes div's. It's an additional DOM element that is unnecessary.

Marked as helpful

1

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