Go to a new line after meet some char with css

Roberto C. Published at Dev

Roberto C.

I have something like this in a CSV spreadsheet:

<p>Features:• first feature• second feature• third feature• fourth feature• and so on (the totale feature number it's variable)</p>

I would like that each feature go on a new line without insert any HTML tag like this:

Features:
• first feature
• second feature
• third feature
• fourth feature
• and so on (the totale feature number it's variable)

Can CSS be used for achieve this result ?!

(javascript allowed)

Thanks.

Fabrizio Calderan

In my opinion the best solution would involve a server-side script, parsing and changing the structure of your markup. With the given structure, the CSS alone can't be useful to achieve the result.

Anyway, if javascript is an acceptable approach, you could do a simple replace like this after the insertion of the paragraph:

Example http://codepen.io/anon/pen/qoCGI

var par = document.getElementsByTagName('p')[0];
par.innerHTML = par.innerHTML.replace(/•/g, "<br />•");

if you have other characters that you're not able to identify, use a safe range of unicode sequences, like so

par.innerHTML = par.innerHTML.replace(/[\u017C-\uFFFF]+/g, "<br />•");

Result

enter image description here

Collected from the Internet

Please contact [email protected] to delete if infringement.

edited at2021-02-9

Comments

0 comments

From Dev

After printing the previous line where the file contains a single token now need to traverse through the result to meet the requirement

From Dev

Related Related

Article