Skip to content
OverviewSolutions
4
Comments
4

Shaurya Gautam

@SGautam1108100 points

Programmer with a human HEART!

Latest solutions

Latest comments

  • Shaurya Gautam•100
    @SGautam1108

    Hi @aj12-houdini. For me, I did this project in 3 days, ofc, with breaks and classes in between. To improve the solution, there are few things I recommend-

    1. Try your solution without Submit button, that is what makes it truly a thinking based challenge
    2. Give more attention to details. E.g. The text used in multiple places appear to be bolder in design so use font-weight property. You can keep the designs provided at your side and use Chrome dev tools to open responsive mode (Ctrl+Shift+M in Windows)
    3. You can use <header>, <footer> and <main> tags inside <body> tag as required by FEM. These are the landmark tags and you must have one. It's best practices. Similarly, with each input you must have a <label> tag instead of <h4> you have used.

    For now, these will help you out to get the basics right! All the best!

    Marked as helpful
  • Shaurya Gautam•100
    @SGautam1108

    I suggest going to chrome developer settings and go to responsive mode, and set width to 1440 for laptop and 375 for mobile. Then keep the design provided side by side with your attempt. You will clearly notice what differences are there!! All the best!

  • Shaurya Gautam•100
    @SGautam1108

    Hey there, that is a close looking solution and great job. There are a few changes that would actually make it better.

    1. You can add border-radius to your image as well.
    2. Try to compare your design, with help of chrome dev tools and setting the width to 1440px, keeping it side by side to the design image provided. That will help you give a better sense of dimensions and font-sizes being used!
    Marked as helpful
  • Shaurya Gautam•100
    @SGautam1108

    Thanks alot for the suggestion @Sdann26! Great to see such an active community here ;)