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

On Tue, Sep 10, 2013 at 3:31 PM, Brad Kemper <brad.kemper@gmail.com> wrote:
> On Sep 9, 2013, at 9:07 AM, Håkon Wium Lie <howcome@opera.com> wrote:
>> Also sprach Brad Kemper:
>>>> I understand your wish for the future, though: to style a element
>>>> based on which page it ends up on. What would your ideal syntax look
>>>> like?
>>>
>>> Too late for my ideal, which was putting selectors directly within
>>> @page, and using an inner @rule or something like body to style the
>>> box itself. At this point, @content would be OK, but bare curly
>>> braces would be better. Like this:
>>>
>>> @page :right {
>>>   background-color: black;
>>>   margin-right:2in;
>>>   {
>>>       * { color: white; }
>>>       .next-page { background-color: red; float:right-top}
>>>       img { float: right-middle; }
>>>   }
>>
>> That could work. Let's see. Hmm. Or, another option may be to base it on:
>>
>>  http://www.w3.org/TR/css3-gcpm/#selecting-columns-and-pages
>>
>> So, you could say
>>
>>  body::page(left) img { float right-middle }
>>
>> or
>>
>>  div.chapter::page(2n+1) { background: red }
>
> I have my preference for creating a block around the selectors rather than repeating a pseudo-class for each selector. It does a nice job of visually grouping related rules, with less repetition.
>
> But I guess it comes down to how many rules a person would need to write that are page specific. If it is several per page type, as I think would be common, then the grouping and less repetition is definitely better, and more important (imagine if we had 'html:print' instead of '@media print'). If it is just a few exceptions here and there, and you want the rules listed with their non-page-specific counter parts, then maybe the pseudo-class approach would be better.
>
> I don't think so though, and it feels weird to me to put that at the end of some arbitrary simple selector (it wouldn't have to be the last one of the chain, right, since everything on the page is also contained by something that is at least partially on the page?), when the page is wrapping the thing you are selecting. Seems like the page selector should really always be on the left.

The pseudo-element can make sense, as "the fragment of the element
that appears on a described page".

And we clearly just need rule nesting.  ^_^

~TJ

Received on Wednesday, 11 September 2013 09:02:26 UTC