css - handling white space and pre
Archive - Originally posted on "The Horse's Mouth" - 2007-01-01 12:37:21 - Graham Ellis"Thank goodness for the <pre> tag" I used to say - for it give the ability to copy and paste plain text output into a web page and get content up on line very quickly. But alas, the tag is now rather 'old hat' and we're told that it really shouldn't be used - "these things should be done with styles. But which one?
The white-space: pre; attribute replaces the <pre> to </pre>tag pair ... and with a fixed width font family such as courier, you'll find things line up just as they always did. You'll find examples all over our solution centre - for example here where we're presenting MySQL outputs.
Here's the style we used in full:
.codescript {
font-family: "Courier New", Courier, mono;
font-size: 11px;
font-style: normal;
font-weight: 700;
font-variant: normal;
color: blue;
margin: 0px;
padding-top: 12px;
padding-bottom: 12px;
padding-left: 12px;
text-indent: 0em;
white-space: pre;
}