page-break-inside on Google Play Books

[Oxford-eBooks]

Has anyone found issues with page-break-inside:avoid in Google Play Books?
I've tried this on my Sony Z1 and the Windows 8 version with the same effect (oh, hats off to GBP for syncing the file I opened for test on both apps!)

The book I'm working on really needs to keep H1, H2 etc together with the following text - well, it should anyway to look good. I've got page-break-after:avoid inside my H classes and also have tried the old DIV around the stuff to keep together and page-break-inside:avoid trick, but it's being ignored. I put a pink background in the grouping DIV to check, and I can clearly see them spanning pages where they ought to be bumped to the next page.

All the other (good) readers are fine and dandy with this except GPB. This is a shame, cos I really want this to work on GPB. This book is going to go up on Google Play by the publisher and they don't want to have their audience fiddling about copying ACSM files to other readers and the like.

[Jellby]

Originally Posted by Oxford-eBooks

All the other (good) readers are fine and dandy with this except GPB.

Really? I have seen ADE ignoring "page-break-inside: avoid".

I know only two ways of preventing a pagebreak: force a pagebreak before or wrap the content in a really unbreakable container (an image, maybe SVG would work too).

[JSWolf]

Why do you need a page break avoid? Headers don't break automatically.

[RbnJrg]

Originally Posted by Oxford-eBooks

Has anyone found issues with page-break-inside:avoid in Google Play Books?
I've tried this on my Sony Z1 and the Windows 8 version with the same effect (oh, hats off to GBP for syncing the file I opened for test on both apps!)

The book I'm working on really needs to keep H1, H2 etc together with the following text - well, it should anyway to look good. I've got page-break-after:avoid inside my H classes and also have tried the old DIV around the stuff to keep together and page-break-inside:avoid trick, but it's being ignored. I put a pink background in the grouping DIV to check, and I can clearly see them spanning pages where they ought to be bumped to the next page.

All the other (good) readers are fine and dandy with this except GPB. This is a shame, cos I really want this to work on GPB. This book is going to go up on Google Play by the publisher and they don't want to have their audience fiddling about copying ACSM files to other readers and the like.

Don't use "page-break-inside: avoid" but "page-break-after: avoid" with <h> tags. The easiest way to do that is to write in your css stylesheet the following:

h1, h2 {
     page-break-after: avoid;
}

ADE (even ADE 2 and ADE 3) will respect that property but only for epub2 ebooks. Also ADE will respect orphans and widows properties but I don't know why ADE 4 —for epub3 ebooks— it doesn't respect those properties

[Oxford-eBooks]

Originally Posted by RbnJrg

Don't use "page-break-inside: avoid" but "page-break-after: avoid" with <h> tags. The easiest way to do that is to write in your css stylesheet the following:

h1, h2 {
     page-break-after: avoid;
}

ADE (even ADE 2 and ADE 3) will respect that property but only for epub2 ebooks. Also ADE will respect orphans and widows properties but I don't know why ADE 4 —for epub3 ebooks— it doesn't respect those properties

Thanks, I'll give this a try.

[Oxford-eBooks]

Originally Posted by JSWolf

Why do you need a page break avoid? Headers don't break automatically.

What I'm aiming for is for a chunk of content to keep together as much as I can. Quite often it's just a header and a paragraph, but there's sometimes a little image or a small bullet-list or table. This works well on most small screens* on other reader apps on the previous titles in the series but the publisher wants to also sell on Google Play, and it's not behaving the same there.

HOWEVER: I did get a response back from Google saying that the reader behaves differently if you just upload an ePub to your phone and read it in GPB rather than uploading to Partner Centre and then reading it as a reviewer. Curious. I'm going to give this a try today to see what happens.


* yes, yes, I know - "fixed layout vs ePub2, yadda, small screen, can't control the look, yadda". It's worked well on earlier editions with a bit of effort and if you ARE careful and design things to gracefully degrade and adapt then you can get some pretty acceptable technical layout in ePub2. We don't want the customer to have to muck about with downloading specific readers, it needs to work 'out of the box' when they buy it from the vendors - usually Amazon, Apple, Google. Cos that's were the money is (in different proportions!)

[Oxford-eBooks]

Originally Posted by Oxford-eBooks

Thanks, I'll give this a try.

EDIT: Oh, Duh, sorry! I already do that It's the break INSIDE thing that I wrap around sections that I want to keep together.

[Notjohn]

Does Google Play actually ever sell any books?

[Oxford-eBooks]

Originally Posted by Notjohn

Does Google Play actually ever sell any books?

Enough to keep the office stocked with coffee and energy drinks Still, can't beat Amazon for pure BRUTE selling force.

Keeping an eye on Google Play, they might catch up a little.

[dgatwood]

Originally Posted by Oxford-eBooks

Has anyone found issues with page-break-inside:avoid in Google Play Books?

I've never seen any rendering engine that supports "page-break-inside:avoid", including in browsers that claim to support it. Occasionally, you get lucky.

No, wait, that's not quite true. I've seen it work for images, and in some cases, for tables. I've never seen it work on a div or any other element that contains other block elements.

The only surefire way I've seen to make that work is with an image (which can be SVG).

[Hitch]

Originally Posted by dgatwood

I've never seen any rendering engine that supports "page-break-inside:avoid", including in browsers that claim to support it. Occasionally, you get lucky.

No, wait, that's not quite true. I've seen it work for images, and in some cases, for tables. I've never seen it work on a div or any other element that contains other block elements.

The only surefire way I've seen to make that work is with an image (which can be SVG).

Ditto.

Hitch