W3C home > Mailing lists > Public > www-style@w3.org > July 2014

[css-gcpm] Footnotes as Regions

From: Dave Cramer <dauwhe@gmail.com>
Date: Wed, 23 Jul 2014 18:23:38 -0400
Message-ID: <CADxXqOyxBu6cR5JXa2AqO0_RuzOHLhFxh3LBjpg+bSDdFhNhDg@mail.gmail.com>
To: "www-style@w3.org" <www-style@w3.org>
During the Seoul F2F, we discussed the idea of implementing footnotes (and
running heads) using regions [1], in order to reduce the amount of "magic"
required to define footnotes. The basic idea is that we have document
content that needs to move somewhere else. So it seems quite natural to

span.footnote {
  flow-into: footnote;

and then have a "footnote" region at the bottom of the page. Defining that
region could happen in several ways. GCPM currently uses an @footnote area
inside @page, and we could just use that along with "flow-from" rather than
"float: footnote":

@page {
  @footnote { flow-from: footnote }

We could also adopt some box-creation mechanism such as CSS Pagination
Templates [2], and use those in the page context:

@page {
  @slot footnote { flow-from: footnote }

This would allow us to have multiple footnote areas, which is more common
than you think:

@page {
  @slot footnote1 { flow-from: footnote1 }
  @slot footnote2 { flow-from: footnote2 }

The pagination templates spec also has a "required-flow" property, which
could perhaps be at the slot level rather than the template level to say
"don't create this slot unless there's a footnote on the page."

@page {
  @slot footnote {
    flow-from: footnote;
    required-flow: footnote;
    height: auto;

This region could also be an exclusion, so that it carves the necessary
space from the main text area on a page. But there are still lots of issues
to deal with.

A. We need a reference to the footnote's original location, before it was
removed from the flow, so we can insert a reference mark. GCPM has a
::footnote-call pseudo-element, but in Seoul there was some talk of a
general-purpose solution. Right now the book.js folks use three nested
spans for footnotes, which is a burden for document authors. So if
span.footnote was moved to a region, we'd leave behind

span.footnote::place-holder {
  content: counter(footnote);
  font-variant-position: super;

Of course, much bikeshedding would be required. This idea would potentially
be useful for figures, side notes, and any other content that was floated
or moved to a region.

B. We need to express the constraint that the footnote appear on the same
page as its reference, and how to handle footnotes (or portions of
footnotes) that won't fit on the original page. This is where the serious
magic happens.

C. The interaction between footnotes and columns is complex. In particular,
how would you specify that a footnote be displayed at the bottom of the
column that contains the reference?

D. Footnotes are sometimes displayed inline to save space. The document
author could easily do this by setting the display value on the footnote,
but in some cases we'd like the user agent to set short footnotes inline,
and longer footnotes as blocks.

span.footnote {
flow-into: footnote;
bikeshed-display: compact;

I'm starting to write all this up for GCPM level 4, but would very much
appreciate any thoughts.



[1] http://lists.w3.org/Archives/Public/www-style/2014Jun/0106.html
[2] http://dev.w3.org/csswg/css-page-template/
Received on Wednesday, 23 July 2014 22:24:05 UTC

This archive was generated by hypermail 2.4.0 : Monday, 23 January 2023 02:14:42 UTC