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

Re: [css-gcpm] Footnotes as Regions

From: Håkon Wium Lie <howcome@opera.com>
Date: Mon, 28 Jul 2014 11:07:06 +0200
Message-ID: <21462.4794.982243.595708@gargle.gargle.HOWL>
To: Dave Cramer <dauwhe@gmail.com>
Cc: "www-style\@w3.org" <www-style@w3.org>
Dave Cramer wrote:

 > During the Seoul F2F, we discussed the idea of implementing footnotes (and
 > running heads) using regions [1]


 > 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 }
 > }

IMHO, using @slot or some other CSS-based syntax makes much more sense
than using element-based regions.

CSS Books [1] uses CSS-based syntax to create "named areas" (to
complement "named pages"). The basic syntax is:

  @page {
    @area footnotes { /* position the area */ }
  span.fn { flow: footnotes }

It should be possible to converge @slot and @area. Let's investigate.

 > 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."

Named areas are not created unless they have content. This seems like a better default.

 > @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. 

CSS Books calls this: "::call"


 > 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.

Indeed, footnotes and sidenotes are quite similar and it makes sense
to address them in the same specification. Figures have their own issues,
but they're on the same page, so to say.

 > 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?

Prince addresses this by having a separate value on float:

   float: column-footnote

in addition to the normal:

   float: footnote

The corresponding footnote areas would be defined with:
  @page {
    @column-footnote {
      float: bottom;
      float-reference: page; 

In addition to the existing:

  @page {
    @footnote {
      float: bottom;
      float-reference: column; 


 > 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;
 > }

We could add properties for this, but it may be easier to add support
for many variations in footnote formatting by using a functional
notation. E.g.:

  float: footnote;                 /* default: block-level, bottom of page */
  float: footnote(inline)          /* inline footnotes, bottom of page */
  float: footnote(compact)         /* conditional block/inline, bottom of page */
  float: footnote(column)          /* block-level, bottom of column */
  float: footnote(compact column)  /* conditional block/inline, bottom of column */


              Håkon Wium Lie                          CTO °þe®ª
howcome@opera.com                  http://people.opera.com/howcome
Received on Monday, 28 July 2014 09:07:36 UTC

This archive was generated by hypermail 2.4.0 : Friday, 25 March 2022 10:08:45 UTC