Skip to content
Submitted over 1 year ago

Responsive BMI Calculator using CSS (Bootstrap), HTML and Javascript

#bootstrap
Daniel Okundaye•20
@danokundaye
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

I faced two major headaches when attempting this challenge:

  1. While styling the radio buttons, I realized that I could only modify the width; everything else I attempted to apply failed to appear on multiple browsers where I tested the site.

  2. The radio button styles do not appear on iOS devices but do show up on Android. I am wondering if anyone else encountered similar problems while working on this challenge and if there are possible solutions.

Community feedback

  • P
    Alexandra•580
    @Alexandra2888Posted over 1 year ago

    Hi! Congrats for finishing challenge! Your solution is very close to the design! Here are some things I think you can improve:

    • reset also psudo-elements with *::after, *::before,
    • try to use autoprefixer for cross-browser compatibility. Happy coding!
    Marked as helpful
    0
    Daniel Okundaye•20
    @danokundayePosted over 1 year ago

    @Alexandra2888 Hi! Thank you so much for the help, I'll try it out as soon as I can.

    0
    Daniel Okundaye•20
    @danokundayePosted over 1 year ago

    @Alexandra2888 Hi! Thank you so much for the help, I'll try it out as soon as I can.

    0
  • Moveables•0
    @MoveablesPosted over 1 year ago

    Way to go

    The design looks stunning

    1
    Daniel Okundaye•20
    @danokundayePosted over 1 year ago

    thank you! @Moveables

    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