javascript - <p> tag putting all text on one line when line breaks exist -

basically have webpage displaying description client of case.

what happening description gets displayed within paragraph tag placing on 1 line. occurs when have paragraph tag string long , overflows, isn't case here.

example.

this how description shows in webpage.

 description   hjkhjkhj sfgsdfgsdfghjkfjkfghjfghjfgh hjkgh jhkfghjkghjkgh jhkghjkg fjghjfghjfghjfghj fghdfhd fghfgdhfghdfghd  x  x x  ^^^^^^ 

when go dom explorer , @

tag shows me.

<p>hjkhjkhj   sfgsdfgsdfghjkfjkfghjfghjfgh  hjkgh jhkfghjkghjkgh jhkghjkg fjghjfghjfghjfghj  fghdfhd   fghfgdhfghdfghd   &nbsp;x&nbsp;  x&nbsp;x&nbsp;                                  ^^^^^^</p> 

it showing line breaks supposed occur, doesn't translate webpage itself.

just wondering if has come across before? or if knows css around problem.

html "collapses" successive whitespace characters, , more importantly, treats literal "line break characters" plain whitespace:

a line break defined carriage return (
), line feed (
), or carriage return/line feed pair. line breaks constitute white space.

(source)

---

in example, though have multiple carriage returns between "hello" , "world," still treats 1 whitespace character.

<p>    hello                world  </p>

---

in example, have no whitespace between "hello" , "world," because introduce line break element <br>, introduce true line break.

<p>    hello<br>world  </p>

---

as others have mentioned, if maintain whitespace without introducing <br> elements, can use css preformat paragraph tag. namely, use white-space attribute (source) , change value pre-wrap.

p {    white-space: pre-wrap;  }

<p>    whitespace here             maintained!  </p>