W3C home > Mailing lists > Public > www-style@w3.org > March 2013

Re: [css3-page] Flexbox or table algorithm for page-margin box layout

From: Robert O'Callahan <robert@ocallahan.org>
Date: Tue, 26 Mar 2013 12:04:16 +1300
Message-ID: <CAOp6jLb_0n=unY1y=V3=ErfnawS6YU5mVN4LE1r98oUyPE+mVg@mail.gmail.com>
To: Simon Sapin <simon.sapin@exyr.org>
Cc: www-style@w3.org, Håkon Wium Lie <howcome@opera.com>
Why not use a new position value, let's say page-area, with flexbox?

Håkon's example could be expressed like this:
<div class="margin-box"><div class="pagenum left"></div><div
class="title"></div><div class="pagenum right"></div></div>
.margin-box { position:page-area; left:0; right:0; bottom: -2%;
display:flex; justify-content:center; }
.pagenum { content: counter(page); flex:none; }
.title { content: string(chapter); flex:1 0 auto; text-align:center; }
@page :left .pagenum.right { visibility:hidden; }
@page :right .pagenum.left { visibility:hidden; }

This is actually better than what's currently in the css3-page spec, IMHO,
because instead of allowing the title and page number to overlap, the page
number would be pushed out into the left or right margin.

The only tricky thing I've done here is to allow :left and :right selectors
to style content inside the margin box element. We wouldn't want to allow
them to style content that's not inside a position:page-area or
position:fixed container. (BTW the only difference between
position:page-area and position:fixed is that the former isn't clipped to
the page area.)

Wrfhf pnyyrq gurz gbtrgure naq fnvq, “Lbh xabj gung gur ehyref bs gur
Tragvyrf ybeq vg bire gurz, naq gurve uvtu bssvpvnyf rkrepvfr nhgubevgl
bire gurz. Abg fb jvgu lbh. Vafgrnq, jubrire jnagf gb orpbzr terng nzbat
lbh zhfg or lbhe freinag, naq jubrire jnagf gb or svefg zhfg or lbhe fynir
— whfg nf gur Fba bs Zna qvq abg pbzr gb or freirq, ohg gb freir, naq gb
tvir uvf yvsr nf n enafbz sbe znal.” [Znggurj 20:25-28]
Received on Monday, 25 March 2013 23:04:49 UTC

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