Skip to content
Submitted almost 3 years ago

Responsive landing page using Bootstrap Grid

Aayush Juyal•290
@aj12-houdini
Preview site (opens in new tab)View code (opens in new tab)
This is a solution for...Tip calculator app
  • HTML
  • CSS
  • JS
2junior

Design comparison

SolutionDesign

Solution retrospective

This project took me a long time to complete and while completing the project I always felt the pressure of trying to complete it within a day or within a few hours. I was wondering if anybody could discuss how long it usually takes them to complete a project like this and do you prepare what you are going code or do you just jump in to start writing code. Feel free to contact me on Twitter: https://twitter.com/redpack457

Community feedback

  • Shaurya Gautam•100
    @SGautam1108Posted almost 3 years ago

    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
    0

Please log in to post a comment

Log in with GitHub

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