Skip to content
Submitted 9 months ago

Tip Calculator using HTML, CSS, & Javascript

Benhemin•180
@Benhemin
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

I want my screen size changes to be smoother and for the proportions to remain the same. What is the best practice for handling different screen sizes and for dynamic resizing of elements?

When using the figma files for project designs, I can see the exact pixel dimensions for different screen sizes (mobile, desktop), how can I use those values and handle screen size changes easily?

Community feedback

  • Kristina•280
    @frontend-enPosted 7 months ago

    Hello, I hope my tips help you.

    1. No processing errors if 0 people
    2. If there are 0 people, then in tip NaN
    3. When you hover the mouse over the input, the layout moves. Try setting transparent borders by default
    4. It's good to write JS in a separate file
    5. var - considered an obsolete way to declare a variable. Use let and const
    6. Adding inline style is considered not a very good practice
    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