Paradox Designs

Recently, I designed a [[print stylesheet]] for this site. In doing so, I became quite friendly with the W3C’s stylesheet working draft. Most of this draft is well thought out, but here was one section that seemed very poorly drafted; the section on page-margin content.

What are page margins? And why do they matter?

Page margins are the areas outside the print box. In terms of page layout, it’s possibly the most important part of the page. Open any major publication, and you will find many things set in the page margins. Common are things like page numbers, article/chapter titles.

For content printed from a website, you may want to put a footer of some sort on each page. Something like copyright, permalinks, etc.

Implementation

The current implementation is relatively simple. You define what part of the page you want to put content in, and what the content is. This is all through CSS, remember.
For example, this adds a url to the bottom right of each page:

@bottom-right {
content: "http://paradoxdgn.com";
}

Simple, right.

Problem

This syntax is simple, but heavily limited. Let’s say you have an element in your page, generated through server side scripts, like python or PHP, that relates to this page. You cannot place this element outside the page box reliably (without hacks).

Also, the use of CSS content seems to violate the exact purpose of CSS, that is, to provide a series of styles that theme the content. CSS is not for the creation of content. The content: property exists, because it is useful, but nowhere is it the only way to place content on a website, nowhere but page-box.

Solution

Currently, the only solution is having the server side script in question generate the stylesheet in the header of the page.

But this is imperfect, for many reasons, so I also propose a new property: page-position: position repeat;. position defines the location of the element in the page, accepting values such as top-left((The values could match that of the existing page-box options)). repeat defines how the option is repeated, such as first, last, left, right, even, odd, n-th, and all. all is the default.

Image from Flickr