Forum How do I...?

Page break inside last but one paragraph

nico
I would like to have a page break inside the last but one paragraph of a chapter so that:

  • The last line is not alone on the last page.
  • The last but one paragraph is not entirely on the last page (thus leaving a big blank on the last but one page).

I tried to apply page-break-before: avoid; to the last paragraph and page-break-inside: auto; to the last but one paragraph, but it doesn’t seem to work.

Do you have a solution to solve that question?


Here is an example. If you set the margin to 2.5cm instead of 2.0cm you will get the correct result. But I would like to achieve this result without changing anything to the format.

<html>
<head>
  <meta http-equiv="content-type" content="text/html; charset=utf-8" />
  <title>page-break-inside</title>
  <style type="text/css">
    @page{ size: A5; margin: 2.0cm; }
  </style>
</head>
<body>
  <p>source: 
  <a href="http://en.wikipedia.org/wiki/Serendipity_(book_series)">
  http://en.wikipedia.org/wiki/Serendipity_(book_series)</a></p>
  <p>Serendipity is a series of children's books about animals and other creatures. The books were written by Stephen Cosgrove (born July 26, 1945) and illustrated by Robin James. The books are short stories with colorful illustrations that have a moral perspective.</p>
  <p>Cosgrove wrote the books after searching for an easy to read book with a message to read to his then three year-old daughter. After finding primarily large expensive books, Cosgrove teamed up with illustrator James to create low cost softcover books. After receiving an offer to publish the books only in hardcover, Cosgrove created his own publishing company - Serendipity Press. The first four books of the Serendipity Series were released in 1974. They are: Serendipity, The Dream Tree, Wheedle on the Needle, and The Muffin Dragon. Cosgrove merged Serendipity Press with the publishing company, Price/Stern/Sloan-Penguin/Putnum in 1978 so that Cosgrove could focus on writing. Cosgrove decided to re-edit his earlier books, which have been republished with the changes. To date, there are 70 books in the series, written from the kindergarten to grade three levels.</p>
  <p style="page-break-inside: auto; color: firebrick;">The animals in the Serendipity series include bears, cats, dogs, horses, squirrels, rabbits, and mythical creatures such as unicorns, dragons, sea monsters, and pegasus. Cosgrove also invented his own creatures such as the wheedle, hucklebug and kritter. The books present moral issues such as growing up, disabilities, abuse, fear, friendship, prejudice, gossip, and helping the environment.</p>
  <p style="page-break-before: avoid;">At least 25 of the books were translated into Spanish (based on the list in El Dragon Gloton).</p>
</body>
</html>

Edited by nico

dauwhe
What should happen if the last paragraph has lots of lines?

I'm not sure what to do about your particular example, but in general the widow and orphan properties should help with some situations.
nico
My question is for the case when the last paragraph is very short, i.e. 1 or 2 lines. If the last paragraph is longer there is no problem because it is OK to have a long paragraph alone on the last page.

I tried to play with widows and orphans without success.
mikeday
Tricky, I think you would need to identify short paragraphs with JavaScript and give them a special class, or something like that.
nico
I can change the HTML directly as in my example above. But I couldn’t find a way to achieve the result I want.
mikeday
So the problem is if you don't use "page-break-before: avoid" on the last paragraph, then the last page only has a couple of lines. But if you do use it, then the second last page has a big gap.

Ideally, would you want to move only half of the second last paragraph to the last page, so the last page would have more text, but the second last page would have a smaller gap?

I don't think we can express this in CSS yet, unfortunately. And if the content is wide-ranging and unpredictable, I guess you can't do what newspapers do, and hire a subeditor to reword the text to fit on exactly one page. :)
nico
Ideally, would you want to move only half of the second last paragraph to the last page, so the last page would have more text, but the second last page would have a smaller gap?


Yes that’s exactly what I want. I don’t understand why in some situations it works and in other it doesn’t work. In my example, Prince behaves the way I want with 2.5cm margins, but not with 2.0cm.

I dream of texts that would always fit exactly on all pages. 😄
mikeday
Surely it works with 2.5cm margins just because the smaller page pushes more of the text to the last page? Prince isn't doing anything special in this situation. :)
nico
Well, I still don’t understand why adding orphans: 1 to the style property of the second last paragraph doesn’t have any effect.
mikeday
"orphans: 1" just means that one line can be left by itself, so the paragraph can be broken anywhere.
nico
Yes that’s what I understand too. But why Prince doesn’t break the second last paragraph. There are no rules that prevent the break.
mikeday
Good point. If the last paragraph has "page-break-before: avoid" then you would expect it to pull several lines of the second last paragraph to the last page. But it doesn't, it pulls the entire paragraph to the last page.

I think that's just a side-effect of the way we have implemented page-break-before, at block-level instead of line-level. Unfortunately we can't change this in a hurry, but I will add it to the roadmap for future investigation, as it looks like we could handle it better.
nico
Excellent! Thank you for taking care of this question.
mikeday
The latest builds now have modified behaviour for break avoid situations and will try to split previous blocks when applicable instead of shifting the entire block to the next page! :D