New ::first-page pseudo-element

Hi,

We've had user requests for the ability to switch from one column layout 
on the first page, to two column layout on the second and subsequent pages.

To achieve this we have implemented a new ::first-page pseudo-element, 
similar to the existing ::first-line pseudo-element, that can be used to 
adjust a subset of CSS properties for an element on the first page that 
it appears. For example:

     div.chapter { columns: 2 }
     div.chapter::first-page { columns: 1 }

Here is an example HTML and PDF file showing the layout:

     http://www.princexml.com/samples/firstpage/firstpage.pdf
     http://www.princexml.com/samples/firstpage/firstpage.html

This solution solves the columns issue very neatly. It could also easily 
be extended to support all of the block-level non-inherited properties, 
such as the background/border/margin/padding properties.

Supporting inherited properties would require some extra effort, similar 
to that required by ::first-line, as the properties would need to be 
correctly inherited by the children of the block. This would allow 
changing the font style or color on the first page.

All in all, this new pseudo-element is straightforward to implement and 
solves a common layout requirement, so I would like to propose adding it 
to CSS3, eg. to the Generated Content for Paged Media specification.

Best regards,

Michael

-- 
Print XML with Prince!
http://www.princexml.com

Received on Tuesday, 25 October 2011 08:38:41 UTC