Sometimes, we want to add a br tag in React between two strings.

In this article, we’ll look at how to add a br tag in React between two strings.

How to add a br tag in React between two strings?

To add a br tag in React between two strings, we can use the white-space CSS property.

For instance, we write

const Comp = () => {
  const message = `No results. n Please try another search term.`;
  return <div className="new-line">{message}</div>;
};

to add the n new line characters into the message string.

Then we make them render with

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

in our CSS file.

Conclusion

To add a br tag in React between two strings, we can use the white-space CSS property.