Preserving white space and line breaks in a string in HTML
THE SOLOPRENEUR MASTERCLASS
Launching June 24th
In a project I was rendering the description of a job which I got through a <textarea> field in a form, and I stored that in the database.
Now, this description was not interpreted as HTML, and when I added it to the page, the white space and line breaks were not respected by the browser.
I wanted this:
but I got this:
The solution was to add this CSS instruction:
white-space: pre-wrap;which using Tailwind corresponds to the whitespace-pre-wrap class.
→ Get my HTML Handbook
I wrote 20 books to help you become a better developer:
- Astro Handbook
- HTML Handbook
- Next.js Pages Router Handbook
- Alpine.js Handbook
- HTMX Handbook
- TypeScript Handbook
- React Handbook
- SQL Handbook
- Git Cheat Sheet
- Laravel Handbook
- Express Handbook
- Swift Handbook
- Go Handbook
- PHP Handbook
- Python Handbook
- Linux Commands Handbook
- C Handbook
- JavaScript Handbook
- CSS Handbook
- Node.js Handbook