# Special Features of the tuftig.css Stylesheet

tuftig.css is a CSS3 style sheet for the output of Docutils’ HTML5 writer. The rules are inspired by [tufte.css] and [tufte-latex] going back to Edward Tufte’s layout design.

[tufte.css]

Dave Liepmann, Tufte CSS, https://edwardtufte.github.io/tufte-css/.

[tufte-latex]

Bil Kleb, Bill Wood and Kevin Godby, A Tufte-Style Book, https://www.ctan.org/pkg/tufte-latex.

## Fullwidth and Margin Objects

Block elements (paragraphs, admonitions, topics, figures, tables, …) with the “fullwidth” class argument use full text width.

A fullwidth table with LaTeX math commands
arccos | \arccos | gcd | \gcd | Pr | \Pr
arcsin | \arcsin | hom | \hom | projlim | \projlim

A numbered fullwidth figure.

Block elements (admonitions, figures, tables, …) with the “marginal” class argument are set in the right margin (if place permits).

An ordinary paragraph with the “marginal” class argument.

Tight integration of graphics with text is central to Tufte’s work even when those graphics are ancillary to the main body of a text. In many of those cases, a margin figure may be most appropriate.

This is a marginal figure.

This is the legend.

To place an image in the margin, use a marginal figure without caption.

Marginal objects are placed to the right of the preceding main text block.

Note

This is a “note” type admonition with a block-quote inside.

> This is a silly text that is only there to demonstrate line wrapping.

By default, citations and footnotes are set in the margin. To have them in the main text area (like [Testbook] and [tb98] here), use the “align-left” class value.

[Testbook]

John Ex Ample, How to test web pages, Ontario, 1978.

[tb98]

Horst Schramm, Docutils 0.5, in Testberichte III, Leipzig, 1998.

A marginal table
A | B | A or B
--- | --- | ---
False | False | False
True | False | True
False | True | True
True | True | True

[1]

The “align-left” class value ensures this footnote is set in the main text area.