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

a responsive web app using bootstrap and javaScript

#bootstrap
Hassan Muhammad• 220

@HassanMuhammadd

Desktop design screenshot for the Tip calculator app coding challenge

This is a solution for...

  • HTML
  • CSS
  • JS
2junior
View challenge

Design comparison


SolutionDesign

Community feedback

Elaine• 11,420

@elaineleung

Posted

Hi Hassan, good job in building this, first of all! I tested the tip calculator, and I think you can try to work on the functionality a bit as right now, when input the numbers and try to change the tip, the amounts don't get recalculated. I see that you're using onblur in your JS, which I don't really recommend as it mainly is used to remove the focus from the element. I would just write a function that would calculate all the totals, and then call that function whenever a button is clicked or an input value is changed. You can check out my tip calculator if you need some ideas on how to do that: https://www.frontendmentor.io/solutions/responsive-tip-calculator-app-with-plain-js-Nj1Gtzub_V

Also, you got some issues to fix in your report, and it seems like adding a main tag should fix most of these issues, so do try that out! You can simply just change one of the topmost div to main, and that should do.

0

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