Forum How do I...?

CSS: (Pseudo) Selecting of a Classed Element?

twantzen
Is it possible to style the first p.quotation in the following code snippet? All quotation should be on a new, right page:

      <p class="bodytext">So this is the bodytext.</p>
      <p class="quotation">I am quite sure that I have no race prejudices, and I think I have no colour prejudices nor caste prejudices nor creed prejudices. All that I care to know is that a man is a human being – that is enough for me; he can’t be any worse.</p>
      <p class="quotation_author">Mark Twain</p>
      <p class="quotation">Everything should be made as simple as possible, but not simpler.</p>
      <p class="quotation_author">Albert Einstein</p>
      <h1 class="headline1">Headline 1</h1>
      <p class="bodytext">So this is the bodytext.</p>


As far as I know I can’t (pseudo) select classes, only elements, so something like: p.quotation:first{page-break-before:right;} doesn’t work.

Any suggestions?

Thanks, Tobias
mikeday
This new CSS4 selector can do what you want:
:nth-child(1 of p.quotation)

The syntax is a little weird as it was retrofitted onto :nth-child() with the "of" keyword, but at least it finally makes this pseudo-class behave the way people expect. :)
twantzen
Thanks, Mike, works perfectly! Interesting syntax – indeed!

Is there a list, which CSS4 selectors are available in Prince? Or have you implemented them all?
mikeday
Selectors are documented here, most of the structural ones should work as expected.
twantzen
Thanks!