Search code examples
cssjsfprimefacesline-breaks

CSS - Newline after dot . of a paragraph

I have span which have a paragraph.

<span>
Please enter valid Number. Blank Spaces are not allowed to this field. Only Letters, Numbers and Special Characters are allowed.
</span>

I need a CSS solution to bring each sentence to new line when it displayed. I tried with \n and br tag. It didn't work because its error message showed by primeFaces validatorMessage and couldn't find anyway to display messages in newline with primefaces solutions as div span cannot be modified. So trying with CSS to make new line after each sentence.

Pls help on this.

enter image description here

Solution

  • If you can insert \n characters into the text, then white-space: pre-line; will break the lines there for you. See example with and without below:

    <span>
Please enter valid Number.
Blank Spaces are not allowed to this field.
Only Letters, Numbers and Special Characters are allowed.
</span>
<br /><br />
<span style="white-space: pre-line;">
Please enter valid Number.
Blank Spaces are not allowed to this field.
Only Letters, Numbers and Special Characters are allowed.
</span>