- From: Brad Kemper <brad.kemper@gmail.com>
- Date: Mon, 9 Sep 2013 08:12:16 -0700
- To: Håkon Wium Lie <howcome@opera.com>
- Cc: Lea Verou <lea@verou.me>, Alan Stearns <stearns@adobe.com>, www-style list <www-style@w3.org>
On Sep 9, 2013, at 3:23 AM, Håkon Wium Lie <howcome@opera.com> wrote: > Also sprach Brad Kemper: > >>> If you want different sidenotes for left and right pages, you can use >>> the @sidenote construct: >>> >>> @page :left { >>> @sidenote { >>> border-radius: 0.2em 0 0 0.2em; >>> }} >>> @page :right { >>> @sidenote { >>> border-radius: 0 0.4em 0.4em 0; >>> }} >> >> My main point is that you shouldn't have that power only for a side >> note or footnote or element in a margin box. It should be just as >> easy to selectively style any element within the main content area, >> based on the page-selecting @rule. > > My suggested code above was meant as practical suggestions -- it's > specified, implemented and usable today -- as the PDF shows: > > http://people.opera.com/howcome/2013/tests/css-gcpm/sidenote-ah.pdf > > 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; } } @right-top, @right-middle { border-bottom:1px solid gray; padding: 1em 0; { & > * { border-radius: 0 6px 6px 0; } } } @right-top: border-top: 1px solid gray; } @page :first { margin: 1in 2in 1in 1in; background-color:transparent; { * { color: black; } article { border-radius:6px; background-color:yellow; columns: 1; } h2 { font-size: 40px; } p { font-size: 20px; } } } >> Also, your rule above means that _everything_ floated into a >> sidenote gets a border-radius > > That's not what the spec intends. Foonote and sidebar areas are styled > as areas -- not as elements. Sorry, I was reading examples 28 and 35 too fast, and I mislead myself. So, it is more limiting than I thought without my syntax above.
Received on Monday, 9 September 2013 15:12:46 UTC