Not Found
Not Found
Request path contains unescaped characters
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

Age Calculator App Main

Muriel M. 420

@MurielM87

Desktop design screenshot for the Age calculator app coding challenge

This is a solution for...

  • HTML
  • CSS
  • JS
2junior
View challenge

Design comparison


SolutionDesign

Community feedback

@Wali1209

Posted

Hey! @MurielM87 I have read your code. Well done! But few think you can consider:

  • Use <input type="number" > that is specifically designed for accepting numerical input from the user. It also supports additional attributes like step and min/max range
  • Using rem instead of px for specifying lengths in CSS can be a good practice, especially for creating responsive and scalable designs.
  • For Example

input {

width: 9rem; font-size: 2rem; padding: 1rem;

}

.output h1 {

font-size: 5rem;

}

@media screen and (max-width: 600px) {

.card {

width: 22.5rem;

}

.container {

padding: 1.5rem;

}

}

  • You can get a given month's total number of days using the getDate() Method
  • Your form is not validated perfectly especially not the Day Input box

I also submit my Age-calculator challenge you can see my solution If you want and plz let me know how you rate my code.

Regards M Wali

0

Please log in to post a comment

Log in with GitHub
Discord logo

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