[FIXED] How to put 2 javascript items on 1 line?

Issue

I've been creating a JS website where it tells you your age in days. I wrote the code, so that, if you were born before 1990, the website says "Yikes you're old". I styled that text apart from the other text but the output was on another line. I want to bring both texts on the same line. I don't know how to do that, so your help is greatly appreciated. Here's the JS code:

function ageInDays() {
  // variables
    var birthYear = prompt("What Year Were You Born In?");
    var ageInDayss = (2021 - birthYear) * 365;

  //text

    if (birthYear>1990) {
        var h1 = document.createElement('h1');
        var textAnswer = document.createTextNode("You are " + ageInDayss + " days 
        old.");
        h1.setAttribute('id', 'ageInDays');
        h1.appendChild(textAnswer);
        document.getElementById('flex-box-result').appendChild(h1);

   } else {
       var h1 = document.createElement('h1');
       var h2 = document.createElement('h2');
       var textAnswer = document.createTextNode("You are " + ageInDayss + " days old.");
       var textAnswer1 = document.createTextNode(" Yikes... that's old.");
       h1.setAttribute('id', 'ageInDays');
       h2.setAttribute('id', 'yikes');
       h1.appendChild(textAnswer);
       h2.appendChild(textAnswer1);
       document.getElementById('flex-box-result').appendChild(h1).appendChild(h2);
    }


}

How do I bring the "else" output on one line?

Solution

Does in need to be explicitly h1 and h2? They are block elements by default and is not really a good practice to use an element for something else (using it inline) than it was created for.

I'd recommend using span

...
var text1 = document.createElement('span');
var text2 = document.createElement('span');
...

and styling it accordingly.

Answered By - mazanec

Answer Checked By - Mildred Charles (PHPFixing Admin)