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

Lea Verou wrote: 

 > This does not really help in my use case, where I wanted to style
 > child elements / pseudoelements of sidenotes with a different
 > border-radius, like this left page screenshot: [1]. In right pages,
 > the border-radius and the transform of the green label would be
 > different, to maintain the same visual effect. I expect this is not
 > an isolated edge case but something many people would want to do as
 > designing books with CSS catches on more.

Two possible solutions are sketched here:

  http://dev.w3.org/csswg/css-gcpm/#page-and-column-pseudo-elements

#1, building on pseudo-element:

  article::page(left) p {   /* select all p elements that appear on left pages in an article */
    text-align: left;
  } 

#2, Brad's curly brackets solution

 @page :left {
  ...
   {
      p { text-align: left } /* select all p elements that appear on left pages */
   }
 }

I like both syntaxes. Would they fulfill your requirements? Any other proposals?

 > > I'm happy to hear you're formatting your book in CSS;
 > > 
 > >  https://twitter.com/LeaVerou/status/364842221209526273

 > Actually, several O’Reilly animal books today are styled with CSS
 > and printed through AntennaHouse. The difference of mine is that
 > the design is four color and quite a lot more …adventurous than the
 > animal books. The shortcoming discussed in this thread has made
 > several things in my original book design difficult or even
 > impossible to do and I recently found out it has made other,
 > simpler, O’Reilly book designs difficult as well. The AH folks were
 > willing to add something for this, but if there is no spec, it will
 > have to be proprietary, as the need for it is strong.

I agree.

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

Received on Wednesday, 11 September 2013 09:48:50 UTC