Skip to content
Submitted over 1 year ago

Tip Calculator using HTML, CSS, & Javascript

Benhemin•180
@Benhemin
A solution to the Tip calculator app challenge
Preview (opens in new tab)Code (opens in new tab)

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?

Code

Please log in to post a comment

Log in

Community feedback

  • Kristina•300
    @frontend-en

    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

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