Wrapping newlines via CSS
Published on November 30, 2017. Edited on July 5, 2020.
This is a simple tip on how to wrap newlines without converting newlines to <br>
tags. This is quite handy if you have a text without formatting and the only need is to wrap text paragraphs. You don't have to think about HTML sanitization or conversion.
.wrapped-text {
white-space: pre-line;
}
This trims newlines from the start and end of the text. Value pre-line
doesn't render whitespaces in the middle of the text.
Latest blog posts
October 24, 2019
How to fetch your public photos from Instagram without the API
June 12, 2019
CodePen embeds with Contentful and Angular
March 26, 2019
Global HTTP request and response handling with the Axios interceptor
December 2, 2018
Setting up webpack 4 for a project
November 10, 2018
How to create Material Design like form text fields with floating label and animated underline bar
May 2, 2018
How to build a complete form with Vue.js
April 4, 2018
How to transfer the Angular server-side state to the client-side
March 28, 2018
My web developer career story
Latest CodePens
July 9, 2019
Switch between the dark and light mode via CSS custom properties
June 12, 2019
Javascript URL handling
June 9, 2019
Material Design like form input text fields with CSS only
March 27, 2019
Global HTTP request and response handling with the Axios interceptors
March 23, 2019
Navigation wizard example with equal width steps and flexible width of last step
March 23, 2019
Javascript event delegation example
December 9, 2018
Responsive and animated D3.js bar chart with positive and negative values (TypeScript)
November 11, 2018