Re: [css3-page] Styling elements differently based on whether they appear on a left or right page

Brad Kemper wrote:

 > >> My use case is the incredibly common case of sidebars (for notes,
 > >> figures etc). The sidebar should be on the left in left pages and
 > >> on the right in right pages.

 > > http://www.w3.org/TR/css3-gcpm/#floating-inside-and-outside-pages
 > 
 > That's not bad for floats, but doesn't help much if you want to use
 > grid or table-* or something else

The problem at hand is how to best to sidenotes in CSS (as opposed to
how to do sidenotes with feature x). Here's my proposal:

  div.sidebar { float: outside }

Which specifies that the sidenote is floated to the outside edge of
the content box. If you want to push the element further out, into the
marginalia, the code could be:

  div.sidebar { float: outside; float-offset: -5em; width: 4em;  } 

The 'float-offset' property pushes the sidebare further in the
direction where it has been floated, so that it ends up outside the
content box.

AntennaHouse and Prince support float inside/outside. Antennahouse
also support float offsets [1]. Here's a sample document and the resulting
PDF file:

  http://people.opera.com/howcome/2013/tests/css3-gcpm/sidenote.pdf
  http://people.opera.com/howcome/2013/tests/css3-gcpm/sidenote.html

 > It also doesn't help if there is some multi-line text that you want
 > right-aligned on the left pages and left aligned on the right pages
 > (or vice versa). Or if you want left pages to be a different
 > background color and/or foreground color than right pages.

Backgrounds are easy:

  @page :left { background: red }
  @page :right { background: blue }

This is also shown in the demo document above.

Alignment is not part of the proposal. You could specify inheritance
from the page context, I guess.

 > By the way, those three sentences in the gcpm draft you linked to
 > are rather sparse with the details. For 'float:inside | outside', I
 > think it should be defined to be usable in 'media=all', where there
 > is no left or right versions of the continuous media. In that case,
 > I'd default to inside=left, which would also work well for an
 > 'overflow:paged' implementation that did not have facing pages (or
 > in that case would you alternate anyway, based on how the paged
 > media spec defines :left and :right?[1] That would be weird).

Yes, it doesn't seem to make sense to do alternate between :left and
:right on screens.

THanks for your feedback; I'm in the process of updating GCPM to align
with implementations.

  http://dev.w3.org/csswg/css-gcpm/

[1] http://www.antennahouse.com/xslfo/float_extension.htm

-h&kon
              Håkon Wium Lie                          CTO °þe®ª
howcome@opera.com                  http://people.opera.com/howcome

Received on Sunday, 28 July 2013 17:58:27 UTC