Submitted about 1 year ago

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

Daniel Okundaye• 20

@danokundaye

Preview site(opens in new window)View code(opens in new window)

This is a solution for...

Body Mass Index calculator

HTML
CSS
JS

2junior

View challenge

Design comparison

SolutionDesign

Solution retrospective

I faced two major headaches when attempting this challenge:

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.
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

Alexandra• 550

@Alexandra2888

Posted about 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

Daniel Okundaye• 20

@danokundaye

Posted about 1 year ago

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

Daniel Okundaye• 20

@danokundaye

Posted about 1 year ago

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

Moveables• 0

@Moveables

Posted about 1 year ago

Way to go

The design looks stunning

Daniel Okundaye• 20

@danokundaye

Posted about 1 year ago

thank you! @Moveables

Please log in to post a comment

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