CODEWITHSUNDEEP
javascript
marfin fadilah
marfin fadilah

Reputation: 13

The space doesn't counted in paragraph.innerHTML?

I've been recently creating a website that can store any variable whenever the user type in input box. As you can see the code below i used it for creating my website. 

function myFunction() {
    var x = document.getElementById("myText").value;
    document.getElementById("demo").innerHTML = x;
    document.getElementById("myText2").value = x;
}
First Name: <input type="text" id="myText" value="   Mickey">
</br>
</br>
Copy Name: <input type="text" id="myText2">
<p>Click the button to display the value of the value attribute of the text field.</p>

<button onclick="myFunction()">Try it</button>

<p id="demo"></p>

Although the code works as I want, I suddenly found the bug. Here's the bug, when I type a space several times in input box, why the outcome is different when it stored to the demo paragraph but it has a same result with another input box ? The space does counted in another input box but not in demo paragraph. And how to make the total space in input box is same with paragraph.innerHTML when it stored ?

Upvotes: 1

Views: 871

Answers (1)

Dennis
Dennis

Reputation: 4017

Wrap your HTML code in <span class="data"> tags and add the following CSS,

span.data { white-space: pre; }

Duplicate:

HTML/CSS - Best practice for preserving white space on certain elements?

Upvotes: 2

Related Questions