Skip to content
Submitted about 2 months ago

BMI Calculator page

Tsukimi•780
@hikawi
Preview site (opens in new tab)View code (opens in new tab)
This is a solution for...Body Mass Index calculator
  • HTML
  • CSS
  • JS
2junior

Design comparison

SolutionDesign

Solution retrospective

What challenges did you encounter, and how did you overcome them?

At first, because of the weird positioning of the background and the calculator, I was going to use absolute positioning on the calculator section. But it got too cumbersome and annoying to manage for each screen size, I ended up making the background absolute instead of the calculator, probably the better way.

The last section looked pretty intimidating. Using a grid with 12 columns may not be the optimal answer, but it worked out... well enough?

Community feedback

  • Ivaylo Ivanov•260
    @ValsCodesPosted about 2 months ago

    Very impressive! Everything looks great!

    Here are my suggestions for improvements:

    • check the bool that changes the calculators welcome section. When you enter the site it shows the BMI text instead of the Welcome text
    • the left blue part of the hero section in the design spans a little lower under the calculator

    I think the 12 column grid looks awesome, don't touch it :) Size wise things are great and the code is readable.

    Great job overall, keep going!

    Marked as helpful
    0
    Tsukimi•780
    @hikawiPosted about 2 months ago

    @ValsCodes Thanks for your suggestions! I just realized there's actually a welcome section in the calculator, never noticed that haha!

    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