What is the best way to preserve white space in HTML? We have a lot of pages that bring down data from our database, and the data may have multiple spaces in it. The rendered HTML elements that hold the data vary from anchor tags (<a>), spans (<span>), table rows (<tr>, <td>, etc.
The easiest thing to do right now would be to add a global css class like so:
body a, span, tr, td { white-space: pre; }
I'm wondering if there is a better way to implement this without assigning a class to each individual HTML element.
The HTML <pre> tag defines preformatted text preserving both whitespace and line breaks in the HTML document. This tag is also commonly referred to as the <pre> element.
Well, you can use the metacharacter to produce a "non-breaking space." (I used one in-between these two sentences.
I would use the same technique, but inside a data class wrapper where it is needed:
.data a, .data span, .data tr, .data td { white-space: pre; }
HTML:
<div class="data"> .... </div>
<pre>no need for style</pre>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With