Forum How do I...?

Borders and page breaks

cayhorstmann
I am trying to match a style where each note has a border on the top and bottom, like:

div.Note {
    border-top: 3px solid black;
    border-bottom: 1px solid black;
}


But when the note has a page break inside, then Prince puts the borders on each page. In the design, that isn't supposed to happen. There should only be a single top border at the start of the note and a single bottom border at the very end.

I can see that both behaviors can be desirable. Is there a flag to control this?

Edited by cayhorstmann

David J Prokopetz
If I'm understanding your question correctly, this is what the CSS property box-decoration-break governs:

https://www.w3.org/TR/css-break-3/#break-decoration

Note that at the time of this posting, Prince has very limited support for using this property on non-block elements, and departs from the standard by treating "clone" rather than "slice" as the default, presumably because the former is more likely to be intuitively expected in a paged media context. However, assuming that div.Note is in fact a simple block element, setting "box-decoration-break: slice" sounds like it should do what you want.

Edited by David J Prokopetz

cayhorstmann
Thank you! That is exactly what I was looking for.

    box-decoration-break: slice;


works perfectly.