• Guest, before posting your code please take these rules into consideration:
    • It is required to use our BBCode feature to display your code. While within the editor click < / > or >_ and place your code within the BB Code prompt. This helps others with finding a solution by making it easier to read and easier to copy.
    • Don't share a wall of code. All we want is the problem area, the code related to your issue.

    To learn more about how to use our BBCode feature, please click here.

    Thank you, Code Forum.

How to built age calcultor?


New Coder
so i build age calculator, here is the code of age calculator..

<div ><label for="birth_date">Birth Date: </label>
  <input type="text" id="birth_date" /></div>
<div id="age" style="padding-top:2em;"></div>

#main_container {
    width: 400px;
    margin: 20px;
    margin-left: auto;
    margin-right: auto;
    padding: 30px;
    font-family: sans-serif;
    border-radius: 20px;
    border: 3px solid #999;

#birth_date_input, #age_container {
    text-align: center;
    margin: 20px;
    margin-left: auto;
    margin-right: auto;

#age_container {
    margin: 40px 5px;
    padding: 20px;
    border-radius: 50px;
    border: 1px solid #000;
    font-weight: bolder;
    background: #EEE;
    font-size: 20px;
    line-height: 40px;

#calculate {
    cursor: pointer;
    text-align: center;
    width: 200px;
    padding: 5px;
    margin: 10px;
    margin-left: auto;
    margin-right: auto;
    border: 1px solid #999;
    border-radius: 10px;
    background: #FFD119;
    background: -webkit-gradient(linear, left top, left bottom, from(#FFD119), to(#E6B800));
    background: -moz-linear-gradient(top, #FFD119, #E6B800);
    font-weight: bold;
    height: 28px;
    box-shadow: 0 -8px inset;

#calculate:hover {
    background: -webkit-gradient(linear, left top, left bottom, from(#E6B800), to(#FFD119));
    background: -moz-linear-gradient(top, #E6B800, #FFD119);
    margin-top: 13px;
    height: 25px;
    box-shadow: 0 -5px inset;

#calculate:active {
    background: #403300;
    padding-top: 10px;
    height: 20px;
    box-shadow: 0 5px #000 inset;

#age {
    padding: 5px;
    border: 3px dashed #AAA;
    background-color: green;
    background:rgb(100, 100, 1000);
function calculateAge(date)
  const now = new Date();
  const diff = Math.abs(now - date );
  const age = Math.floor(diff / (1000 * 60 * 60 * 24 * 365));
  return age

var picker = new Pikaday({
  field: document.getElementById('birth_date') ,
  onSelect: function(date) {
  let age = calculateAge(date);
  document.getElementById('age').innerHTML = "age: "+age ;


here is the features that i try to bring in this age calculator.
what is age calculator ?
At age calculator
1. you can calculate your age in days
2. age calculator calculates age in seconds.
3. age calculator calulates age in minutes.
4age calculator calculates age in months.
5. age calculator calculates in years,
Why we need age calculator ?
So let’s first understand the age calculator, age calculator has many terms. Different people call age calculator differnetly. Some calls it age calculator, Some calls birth calculator,Some calls date of birth calculator, Some calls dob calculator, some calls date of birth calculation.
Last edited by a moderator: