OOOOPS. Your browser seems to be too old for this. Please update your browser.
Teutonic CSS
Use it

Read widths

I don’t know about you. But I think Wikipedia is a terrible reading experience on a desktop browser — the text lines are too long. Something between 45-75 characters is widely regarded as a satisfactory length per line. The text-length helper classes are keeping this in an aesthetic balance.

The read-width class name is matching the text-size class name. Usually use read_l in combination with .text_l. Appearance can differ from typeface to typeface.

Syntax: .read_{size}
SCSS: _read-widths.scss

I am Posdnous; I be the new generation of slaves; Here to make papes to buy a record exec rakes; The pile of revenue I create.

I am Posdnous; I be the new generation of slaves; Here to make papes to buy a record exec rakes; The pile of revenue I create.

I am Posdnous; I be the new generation of slaves; Here to make papes to buy a record exec rakes; The pile of revenue I create.

I am Posdnous; I be the new generation of slaves; Here to make papes to buy a record exec rakes; The pile of revenue I create.

<p class="pa-v_m text_s read_s">I am Posdnous; I be the new generation of slaves; Here to make papes to buy a record exec rakes; The pile of revenue I create.</p>
<p class="pa-v_m text_m read_m">I am Posdnous; I be the new generation of slaves; Here to make papes to buy a record exec rakes; The pile of revenue I create.</p>
<p class="pa-v_m text_l read_l">I am Posdnous; I be the new generation of slaves; Here to make papes to buy a record exec rakes; The pile of revenue I create.</p>
<p class="pa-v_m text_xl read_xl">I am Posdnous; I be the new generation of slaves; Here to make papes to buy a record exec rakes; The pile of revenue I create.</p>