Jarvis WordPress Theme Styleguide

3.4.5 #elements.html.pre Preformatted Text

Toggle example guides Toggle HTML markup

For preformatted text. Displayed in a fixed-width font, and preserves both spaces and line breaks.

Examples
Default styling
Hogwarts, Hogwarts, Hoggy Warty Hogwarts,
Teach us something please,
Whether we be old and bald
Or young with scabby knees,
Our heads could do with filling
With some interesting stuff,
For now they’re bare and full of air,
Dead flies and bits of fluff,
So teach us things worth knowing,
Bring back what we’ve forgot,
Just do your best, we’ll do the rest,
And learn until our brains all rot.
.compress
Reduces the height of the pre element and forces a vertical scrollbar.
Hogwarts, Hogwarts, Hoggy Warty Hogwarts,
Teach us something please,
Whether we be old and bald
Or young with scabby knees,
Our heads could do with filling
With some interesting stuff,
For now they’re bare and full of air,
Dead flies and bits of fluff,
So teach us things worth knowing,
Bring back what we’ve forgot,
Just do your best, we’ll do the rest,
And learn until our brains all rot.
Markup
<pre class="[modifier class]">
Hogwarts, Hogwarts, Hoggy Warty Hogwarts,
Teach us something please,
Whether we be old and bald
Or young with scabby knees,
Our heads could do with filling
With some interesting stuff,
For now they’re bare and full of air,
Dead flies and bits of fluff,
So teach us things worth knowing,
Bring back what we’ve forgot,
Just do your best, we’ll do the rest,
And learn until our brains all rot.
</pre>
Source: assets/sass/lib/elements/_html.scss, line 234