score:2

Accepted answer

if you want "\n" to work you need to add css property style={{whitespace: "pre-line"}}

function reactapp(){
     const text = "complete tasks faster than ever before.\n with our platform, it only takes minutes."
     return (
         <div style={{whitespace: "pre-line"}} >{text}</div>
     )
}

score:0

i suggest solving this using styling, not content-driven. if you reduce the width of your div element, the text will break by default.

score:0

split them up into separate <p> tags, or put a <br> tag in between the,.

score:0

the best approach would be to put the text into separate containers (e.g divs).

eventually, you can try to use the white-space: pre-line property.

e.g

.break-line {
   white-space: pre-line;
}

and then in render do such:

render() {
   return <div classname="break-line">complete tasks faster than ever before. \n with our platform, it only takes minutes</div>
}

it should do the job. in case of any questions don't hesitate to ask! you can read more about the white-space property here: https://developer.mozilla.org/en-us/docs/web/css/white-space

score:0

wrap your text in span like :

<span>your text</span><br>
<span>next text</span>

score:1

you can add the <br /> html tag if it's possible


Related Query

More Query from same tag