Another "glitch" of ADE

[Jellby]

When I force a pagebreak after a particular element (with "page-break-after: always" CSS rule) it seems the next element's top margin is ignored, and it's rendered (by Adobe Digital Editions) at the top of the next page instead. So, for example:

[code]<div class="dedication">To my wife</div>

<h1>Chapter 1</h1>[</code]

if div.dedication has "page-break-after: always", there is, indeed a page break before Chapter 1, but the heading just ignores the "margin-top: 4em" in h1.

Is this a "bug" in ADE or am I mistaken in my interpretation of how pagebreaks should work? Is there a simple workaround? Any Adobe employee reading this who could fix it? I guess the Sony readers will have the same behaviour, am I right?

[llasram]

Originally Posted by Jellby

Is this a "bug" in ADE or am I mistaken in my interpretation of how pagebreaks should work? Is there a simple workaround? Any Adobe employee reading this who could fix it? I guess the Sony readers will have the same behaviour, am I right?

I actually think this is correct behavior. From the CSS 2.1 spec, "Allowed Page Breaks":

In the normal flow, page breaks can occur at the following places:

1. In the vertical margin between block boxes. When a page break occurs here, the used values of the relevant 'margin-top' and 'margin-bottom' properties are set to '0'.
2. Between line boxes inside a block box.

These breaks are subject to the following rules:

• Rule A: Breaking at (1) is allowed only if the 'page-break-after' and 'page-break-before' properties of all the elements generating boxes that meet at this margin allow it, which is when at least one of them has the value 'always', 'left', or 'right', or when all of them are 'auto'.

[Emphasis added]

Seems pretty straightforward. Firefox/libgecko also expresses the same behavior when operating in paginated mode for i.e. printing. Not sure about IE, but the MSReader renderer doesn't ignore the "relevant margin," alas.

[Jellby]

Great... so how am I to have a forced page break without affecting vertical margins (short of splitting the text in two files)?

A dirty hack would be:

<div style="page-break-before: always">&nbsp;</div>

before the chapter heading proper, but... well, it's dirty

[Jellby]

Hmm... and why doesn't this appear centered?

<div class="halftitle">
Frankenhausen<br/>
(1525)
</div>

whith:

div.halftitle {
font-style: italic;
font-size: 120%;
text-align: center;
margin: 4em 0 4em 0;
}

The block is more or less centered in the page, but the two lines look almost right-aligned, either the first line has a negative indent or the second a positive one...

[ilovejedd]

Have you tried the following? Not sure if it'll work but it's worth a try. I recall playing with this the past weekend, but I don't have the relevant files in front of me now so I'll have to double-check when I get home.
CSS

.story {
  page-break-before: always;
}
.chaptitle {
  margin-top: 4em;
}

XHTML

<div class="dedication">To my wife</div>
<div style="story">
<h1 class="chaptitle">Chapter 1</h1>
<p>First chapter goes here.</p>
</div>

Not at home right now, so I'll have to double-check, but iirc, I use the following for margins

I've never had luck centering text within div. Try using:
CSS

.halftitle {
  font-style: italic;
  font-size: 120%;
  text-align: center;
  margin: 4em 0 4em 0;
}

XHTML

<h1 class="halftitle">
Frankenhausen<br/>
(1525)
</h1>

[llasram]

Originally Posted by Jellby

Great... so how am I to have a forced page break without affecting vertical margins (short of splitting the text in two files)?

I actually think splitting into multiple files is a good solution. Even if you don't want to do it by hand, code to split at page breaks (either via parsing the CSS or just separately-specified @class values) isn't so hard.

Another option is to use padding instead of margins for vertical space you want to be preserved even on the box following a page break.

[llasram]

Originally Posted by Jellby

The block is more or less centered in the page, but the two lines look almost right-aligned, either the first line has a negative indent or the second a positive one...

I've definitely noticed some wackiness with how ADE handles centering. Double-check your text-indent to be safe? But if that is right, try fiddling with the whitespace within the element. It shouldn't affect how the positioning, but it seemingly does.