Note: This site is currently "Under construction". I'm migrating to a new version of my site building software. Lots of things are in a state of disrepair as a result (for example, footnote links aren't working). It's all part of the process of building in public. Most things should still be readable though.

Wrap Text In pre Tags With white-space In CSS

To wrap blocks of text or code in pre tags, use:

Example Thing Whatever

white-space: pre-wrap

Examples

These examples show the different ways to use _white-space__ to change the way _pre__ tags wrap text. Each example uses this single line of text in a pre tag that looks like this:

white-space: normal

Start    it          Guess_the_results_from_the_first_scores. Hang tinsel from both branches

white-space: nowrap

Start    it          Guess_the_results_from_the_first_scores. Hang tinsel from both branches

white-space: pre 

Start    it          Guess_the_results_from_the_first_scores. Hang tinsel from both branches

white-space: pre-wrap

Start    it          Guess_the_results_from_the_first_scores. Hang tinsel from both branches

white-space: pre-line

Start    it          Guess_the_results_from_the_first_scores. Hang tinsel from both branches

white-space: break-spaces 

Start    it          Guess_the_results_from_the_first_scores. Hang tinsel from both branches