CSS による断片化 — CSS Fragmentation Module Level 4

1.1. ~module間の相互作用

この~moduleは、 `CSS2$r `§ 13.3＠~CSS22/page.html#page-breaks$ および `CSS-PAGE-3$r にて定義される~page割り制御を置換し, 拡張する。 ◎ This module replaces and extends the pagination controls defined in [CSS2] section 13.3 and in [CSS-PAGE-3].

1.2. 値~定義

【 この節の内容は `~CSS日本語訳 共通~page＠~CSScommon#values$に移譲。 】

2.1. 並行する断片化~flow

複数の`整形~文脈$が互いに並行して~lay-outされる下では、 断片化は，各~整形~文脈ごとに独立に行われる。 例えば，要素が浮動されている場合、 `浮動体$の内側にある`強制d分断$は，（浮動体の`塊~size$を増大させ得ることを除いて）浮動体の外側の内容の~layoutには，影響しないことになる。 ~UAは、 互いに並行する整形~文脈~内の`非強制d分断$の配置を調整して，横並びになる内容を視覚的に整えてもヨイ — `強制d分断$に対しては、 そのように調整してはならない。 ◎ When multiple formatting contexts are laid out parallel to each other, fragmentation is performed independently in each formatting context. For example, if an element is floated, then a forced break inside the float will not affect the content outside the float (except insofar as it may increase the height of the float). UAs may (but are not required to) adjust the placement of unforced breaks in parallel formatting contexts to visually balance such side-by-side content, but must not do so to match a forced break.

それぞれが独立に内容を断片化するような，並行する~flowの例には、 次が挙げられる： ◎ The following are examples of parallel flows whose contents will fragment independently:

• `浮動体$の内容と, その周囲を取り巻く内容。 ◎ The contents of a float vs. the content wrapping outside the float.
• `浮動体$の内容と, それに隣接な浮動体の内容。 ◎ The contents of a float vs. the contents of an adjacent float.
• 同じ~table~row内の各~table~cellの内容。 ◎ The contents of each table cell in a single table row.
• 同じ格子~row内の各~格子~駒の内容。 ◎ The contents of each grid item in a single grid row.
• ~flex~layoutにおける同じ~row内の各~flex駒の内容。 ◎ The contents of each flex item in a flex layout row.
• 各 絶対的に位置された要素の，内容 — それらの`包含塊$の`断片化~文脈$が同じ範囲を覆うような。 ◎ The contents of absolutely-positioned elements that cover the same range of their containing block’s fragmentation context.

固定d~sizeにされた~boxの内容~辺を~overflowする内容は、 その~boxに後続する内容に並行するものと見なされ，通常の断片化~規則に従う。 ~overflowする内容は，`断片化~根$~boxの~sizeには影響しないが、 `断片~化~flow$の長さを増大させ，溢れるか追加的な`断片容器$を必要yなだけ生成させる。 ◎ Content overflowing the content edge of a fixed-size box is considered parallel to the content after the fixed-size box and follows the normal fragmentation rules. Although overflowing content doesn’t affect the size of the fragmentation root box, it does increase the length of the fragmented flow, spilling into or generating additional fragmentainers as necessary.

2.2. 入子な断片化~flow

`断片容器$ %F の分断法は、 実質的に， %F を 2 つの`断片容器$ %F1, %F2 に分割する。 通常との唯一の相違は、 `断片容器$ %F の内容に関して， %F1, %F2 の合間の`分断の型$が — %F の自前の`断片化~文脈$により作成されるものではなく — %F を分割する`断片化~文脈$により作成される`分断の型$になることである。 ◎ Breaking a fragmentainer F effectively splits the fragmentainer into two fragmentainers (F1 and F2). The only difference is that, with regards to the content of fragmentainer F, the type of break between the two pieces F1 and F2 is the type of break created by the fragmentation context that split F, not the type of break normally created by F’s own fragmentation context.

注記： `複-柱~容器$が何~pageかに分断されるときは、［ `複-柱~容器$の中の`~page分断$は、 常に，`~page分断$かつ`柱~分断$になる ］よう，残りの内容~用の新たな［ 柱たちが成す~row ］が次~page以降に生成される。 ◎ Note that when a multi-column container breaks across pages, it generates a new row of columns on the next page for the rest of its content, so that a page break within a multi-column container is always both a page break and a column break.

3.1. ~box間の分断： `break-before^p, `break-after^p ~prop

これらの~propは、 生成された~boxの前後における［ ~page／柱／領域 ］分断の挙動を指定する： ◎ These properties specify page/column/region break behavior before/after the generated box.＼

• 次に挙げる `分断強制~値@ は、 ~flowにおいて`強制d分断$を作成する ⇒ `always$v, `all$v, `left$v, `right$v, `recto$v, `verso$v, `page$v, `column$v, `region$v ◎ The forced break values always, all, left, right, recto, verso, page, column and region create a forced break in the flow while＼
• 一方，次に挙げる `分断回避~値@ は、 前後の内容が一緒に保たれるベキであることを指示する ⇒ `avoid$v0, `avoid-page$v0, `avoid-column$v0, `avoid-region$v0 ◎ the avoid break values avoid, avoid-page, avoid-column and avoid-region indicate that content should be kept together.

`break-before$p ／ `break-after$p 用の各種 値は、 以下の下位節にて定義される。 ~UAは、 これらの~propを，`断片化~根$の通常~flowの中の~boxに適用するモノトスル。 また、［ `包含塊$が断片化された`根~要素$の通常~flowの中にあるような，浮動d~box ］にも適用するベキである。 ~UAは、 これらの~propを他の~boxにも適用してヨイが，絶対的に位置された~boxには適用しないモノトスル。 ◎ Values for break-before and break-after are defined in the sub-sections below. User agents must apply these properties to boxes in the normal flow of the fragmentation root. User agents should also apply these properties to floated boxes whose containing block is in the normal flow of the root fragmented element. User agents may also apply these properties to other boxes. User agents must not apply these properties to absolutely-positioned boxes.

以下における， `首要~box@0 とは、 当の要素が生成する`塊~level$の`首要~box$を意味する。 この節の以下における “前／後” は、 個別に `break-before$p ／ `break-after$p に対応するものとする。

3.2. ~box内での分断： `break-inside^p ~prop

この~propは、 要素の`首要~box$0における［ ~page／柱／領域 ］分断の挙動を指定する。 各種 値は、 次を意味する： ◎ This property specifies page/column/region break behavior within the element’s principal box. Values have the following meanings:

`auto@v0

`首要~box$0内の分断法に追加的な拘束を課さない。 ◎ Impose no additional breaking constraints within the box.

`avoid@v0

`首要~box$0内での分断を，避ける。 ◎ Avoid breaks within the box.

`avoid-page@v0

`首要~box$0内での`~page分断$を，避ける。 ◎ Avoid a page break within the box.

`avoid-column@v0

`首要~box$0内での`柱~分断$を，避ける。 ◎ Avoid a column break within the box.

`avoid-region@v0

`首要~box$0内での`領域~分断$を，避ける。 ◎ Avoid a region break within the box.

3.3. 行l間の分断： `orphans^p, `widows^p

［ `orphans$p ／ `widows$p ］~propは、 `塊~容器$~内の`分断$において，その［ 前／後 ］に［ `断片$内に残さなければならない最小な行l~box数 ］を指定する。 `後述＠#widows-orphans-example$にて、 これらを利用して`分断$を制御する例を与える。 ◎ The orphans property specifies the minimum number of line boxes in a block container that must be left in a fragment before a fragmentation break. The widows property specifies the minimum number of line boxes of a block container that must be left in a fragment after a break. Examples of how they are used to control fragmentation breaks are given below.

［ `orphans$p ／ `widows$p ］の値には、 正な整数のみ許容される。 負な値や 0 は無効であり、 当の宣言を`無視する$モノトスル。 ◎ Only positive integers are allowed as values of orphans and widows. Negative values and zero are invalid and must cause the declaration to be ignored.

塊が包含する行l数が［ `orphans$p ／ `widows$p ］の値より少ない場合、 単に，［ 塊~内のすべての行lが一緒に保たれなければならない ］とする規則に変わる。 ◎ If a block contains fewer lines than the value of widows or orphans, the rule simply becomes that all lines in the block must be kept together.

3.4. ~page分断~propの別名： `page-break-before^p, `page-break-after^p, `page-break-inside^p

`CSS2$r `§ ~paged媒体＠~CSS22/page.html$ との互換性を得るため、 `CSS2$r に適合する~UAは，［ `page-break-before$p ／ `page-break-after$p ／ `page-break-inside$p ］~propを［ `break-before$p ／ `break-after$p ／ `break-inside$p ］の別名として扱う — すなわち，次の表tに与える値の対応付けの下で、 各種 `page-break-*^p ~propを，対応する `break-*^p ~prop用の`旧来の略式~prop$として扱う— モノトスル： ◎ For compatibility with CSS Level 2, UAs that conform to [CSS2] must alias the page-break-before, page-break-after, and page-break-inside properties to break-before, break-after, and break-inside by treating the page-break-* properties as legacy shorthands for the break-* properties with the following value mappings:

4.1. アリな分断点

断片化は、 塊~flow次元において，~boxを分割する。 ［ 塊／行内 ］~flowにおける分断は、 以下に挙げる所で生じ得る： ◎ Fragmentation splits boxes in the block flow dimension. In block-and-inline flow, breaks may occur at the following places:

`A類~分断点@

以下に挙げる型の，互いに同胞な~boxの合間： ◎ Between sibling boxes of the following types:

塊に平行な断片化： ◎ Block-parallel Fragmentation

すなわち、 同胞~boxたちの`包含塊$の`塊~flow方向$が，`断片化~文脈$のそれに平行である下では：

• `~flow内$にある， 2 つの［ `塊~level$の~box ］の合間
• `浮動体$, それに~~直に隣接な［ ~flow内にある~box／浮動d~box ］の合間
• 2 つの［ ~table~row~group~box ］の合間
• 2 つの［ ~table~row~box ］の合間
• 複-柱における，2 つの［ 柱~row~box ］の合間

◎ When the block flow direction of the siblings' containing block is parallel to that of the fragmentation context: in-flow block-level boxes, a float and an immediately-adjacent in-flow or floated box, table row group boxes, table row boxes, multi-column column row boxes.

塊に垂直な断片化

すなわち、 同胞~boxたちの`包含塊$の`塊~flow方向$が，`断片化~文脈$のそれに垂直である下では：

• 2 つの［ ~table~col~group~box ］の合間
• 2 つの［ ~table~col~box ］の合間
• 複-柱における， 2 つの［ `柱~box$ ］の合間

◎ When the block flow direction of the siblings' containing block is perpendicular to that of the fragmentation context: table column group boxes, table column boxes, multi-column column boxes.

`B類~分断点@

`塊~容器$~boxの内側にある，2 本の［ `行l~box$ ］の合間 ◎ Between line boxes inside a block container box.

`C類~分断点@

`塊~容器$~boxの［ 内容~辺, 子~内容の外縁~辺 ］の合間 — `ただし^em，合間を成す隙間が 0 でない場合に限る。 外縁~辺とは、 子が［ `塊~level$ならば その~margin辺 ／ `行内~level$ならば その行l~box辺 ］を指す。 【！XXX add example】 ◎ Between the content edge of a block container box and the outer edges of its child content (margin edges of block-level children or line box edges for inline-level children) if there is a (non-zero) gap between them.

注記： これら各~類の分断点の間には、 内来的な優先順位は無い。 しかしながら，個々の分断点には、 `分断法の制御$を利用して，優先順位が 付与される／解除される こともある。 ◎ Note: There is no inherent prioritization among these classes of break points. However, individual break points may be prioritized or de-prioritized by using the breaking controls.

注記： 他の~layout~modelは、 上述の各~類の分断点を追加し得る。 例えば、 `CSS-FLEXBOX-1$r は，~flex整形~文脈における ある種の地点を［ `A類~分断点$ ／ `C類~分断点$ ］として追加する。 ◎ Note: Other layout models may add breakpoints to the above classes. For example, [CSS-FLEXBOX-1] adds certain points within a flex formatting context to classes A and C.

断片化-不能な内容もある — 例えば，［ 多くの型の`置換d要素$（画像や動画など）, ~scroll~~可能な要素, ~text内容の単独の行l ］など。 その種の内容は `単体的@ と見なされ、 アリな分断点を包含しない。 したがって、 そのような~boxの中の`強制d分断$は~boxを分割できず、 ~boxの自前の断片化~文脈からは，無視されるモノトスル。 ◎ Some content is not fragmentable, for example many types of replaced elements [CSS2] (such as images or video), scrollable elements, or a single line of text content. Such content is considered monolithic: it contains no possible break points. Any forced breaks within such boxes therefore cannot split the box, and must therefore also be ignored by the box’s own fragmentation context.

一般に断片化-不能な内容に加え、 ~UAは，次に挙げる どの要素も`単体的$と見なしてもヨイ： ◎ In addition to any content which is not generally fragmentable, UAs may consider as monolithic＼

• `overflow$p が［ `auto^v ／ `scroll^v ］にされた要素 ◎ any elements with overflow set to auto or scroll and＼
• `overflow^p が `hidden^v, かつ `論理-縦幅$が `~autoS$v でない（かつ最大`論理-縦幅$が指定されていない）要素 ◎ any elements with overflow: hidden and a non-auto logical height (and no specified maximum logical height).

`行l~box$は，`アリな分断点$を包含しないので、［ `行内~level$の`表示~型$のうち，`独立な整形~文脈$を確立するもの（ `inline-block$v, `inline-table$v など） ］は，`単体的$と見なしてもヨイ： すなわち、 単独の行l~boxが — それ自身が断片容器を成しているとしても — `断片容器$に収まるには大き過ぎで，~UAは行l~boxを分割することを選ぶ事例では、 そのような~boxを断片化しても，単体的として扱ってもヨイ。 ◎ Since line boxes contain no possible break points, inline-block and inline-table boxes (and other inline-level display types that establish an independent formatting context) may also be considered monolithic: that is, in the cases where a single line box is too large to fit within its fragmentainer even by itself and the UA chooses to split the line box, it may fragment such boxes or it may treat them as monolithic.

4.2. 分断の型

~CSSにおいては、 種々の分断~型が，それらが~spanする`断片容器$の型に基づいて定義される： ◎ There are different types of breaks in CSS, defined based on the type of fragmentainers they span:

`~page分断@

2 つの`~page~box$の合間にある分断。 `CSS-PAGE-3$r ◎ A break between two page boxes. [CSS-PAGE-3]

`見開き分断@

`対向~page$にされてない 2 つの~page~boxの合間にある分断。 見開き分断は、 `~page分断$でもある。 `CSS-PAGE-3$r ◎ A break between two page boxes that are not associated with facing pages. A spread break is always also a page break. [CSS-PAGE-3]

`柱~分断@

2 つの`柱~box$の合間にある分断。 これらの~boxが異なる~page上に在る場合、 分断は`~page分断$にもなることに注意。 同様に，~boxが異なる領域に在る場合、 分断は`領域~分断$にもなる。 `CSS-MULTICOL-1$r ◎ A break between two column boxes. Note that if the column boxes are on different pages, then the break is also a page break. Similarly, if the column boxes are in different regions, then the break is also a region break. [CSS-MULTICOL-1]

`領域~分断@

2 つの`領域$の合間にある分断。 これらの~boxが異なる~page上にある場合、 分断は`~page分断$にもなることに注意。 `CSS3-REGIONS$r ◎ A break between two regions. Note that if the region boxes are on different pages, then the break is also a page break. [CSS3-REGIONS]

注記： 分断~型には他にも、 2 本の`行l~box$に分断する`行l分断$もあるが、 この仕様では受持たない。 `CSS2$r, `CSS-TEXT-3$r を見よ。 ◎ Note: A fifth type of break is the line break, which is a break between two line boxes. These are not covered in this specification; see [CSS2] [CSS-TEXT-3].

4.3. 強制d分断

`強制d分断@ は、 ~stylesheet作者により明示的に指示される分断である。 `強制d分断$は、［［ 先行の同胞~boxに［ 指定される／`伝播-$される【！#propagate】 ］ `break-after$p ~prop ］, または［ ~~後続の同胞~boxに［ 指定される／`伝播-$される ］ `break-before$p ~prop ］のうち，少なくとも一方が`分断強制~値$をとる場合に、 `A類~分断点$にて生じる。 （したがって，この`分断強制~値$は、 実質的に，同じ分断点に適用されるどの`分断回避~値$も上書きする。） ◎ A forced break is one explicitly indicated by the style sheet author. A forced break occurs at a class A break point if, among the break-after properties specified on or propagated to the earlier sibling box and the break-before properties specified on or propagated to the later sibling box there is at least one with a forced break value. (Thus a forced break value effectively overrides any avoid break value that also applies at that break point.)

単独の分断点に，複数の`分断強制~値$が適用されるときには、 それらの分断~型すべてが尊守されるように，組合される。 ［ `left$v, `right$v, `recto$v, `verso$v ］が組合されたときは、 ~flowの中で最も末尾側の要素に指定された値が，優先される。 ◎ When multiple forced break values apply to a single break point, they combine such that all types of break are honored. When left, right, recto, and/or verso are combined, the value specified on the latest element in the flow wins.

注記： 強制d`~page分断$は、［ この~margin【どの？】の直前と直後の行l~boxが， 同じ `page$p ~prop値をとらない ］場合には，`A類~分断点$にも生じるモノトスル。 `CSS-PAGE-3$r を見よ。 ◎ Note: A forced page break must also occur at a class A break point if the last line box above this margin and the first one below it do not have the same value for page. See [CSS-PAGE-3].

強制d分断が生じる場合、 内容が［ その分断に結び付けられている型の，次の`断片容器$ ］の中に入る様に強制する — 指定された分断~型がすべて満たされるまで，必要yなだけ`断片化~文脈$の入子階層を遡って。 合致する型の`断片化~文脈$に包含されない強制d分断には、 効果はない。 ◎ When a forced break occurs, it forces ensuing content into the next fragmentainer of the type associated with the break, breaking through as many fragmentation contexts as necessary until the specified break types are all satisfied. If the forced break is not contained within a matching type of fragmentation context, then the forced break has no effect.

4.4. 非強制d分断

`分断法の制御$は、 分断を強制できるのみならず，忌避することもできる。 `非強制d分断@ とは、 内容が`断片容器$を~overflowしないように，~UAにより自動的に挿入される分断である。 `アリな分断点$にて，非強制d分断法が許容されるかどうかは、 次の規則により制御される： ◎ While breaking controls can force breaks, they can also discourage them. An unforced break is one that is inserted automatically by the UA in order to prevent content from overflowing the fragmentainer. The following rules control whether unforced breaking at a possible break point is allowed:

規則 1

`A類~分断点$においては、 この分断点に適用-可能な［［ `break-after$p ／ `break-before$p ］の値 ］すべてが，`断片~化~flow$の分断を許容する — すなわち，次のいずれかの場合に限り，分断が許容される：

• それらの値に一つでも分断を強制するものがある
• それらを禁止するもの（ `分断の型$に依存して，［ `avoid$v, `avoid-page$v, `avoid-column$v, `avoid-region$v ］のうち，いくつか）はない。

◎ A fragmented flow may break at a class A break point only if all the break-after and break-before values applicable to this break point allow it, which is when at least one of them forces a break or when none of them forbid it (avoid or avoid-page/avoid-column/avoid-region, depending on the break type).

規則 2

しかしながら、 ~AND↓ も満たされる場合，そこで分断するのは許容されない：

• それらの値すべてが `auto^v
• ［ すべての要素に共通な ある先祖 ］の `break-inside$p の値は `avoid$v0

◎ However, if all of them are auto and a common ancestor of all the elements has a break-inside value of avoid, then breaking here is not allowed.

規則 3

`B類~分断点$においては、 分断を囲んでいる塊~boxについて ~AND↓ も満たされる場合に限り，分断が許容される：

• 分断と~boxの始端の合間にある行l~box数は `orphans$p の値~以上である
• 分断と~boxの終端の合間にある行l~box数は `widows$p の値~以上である

◎ Breaking at a class B break point is allowed only if the number of line boxes between the break and the start of the enclosing block box is the value of orphans or more, and the number of line boxes between the break and the end of the box is the value of widows or more.

規則 4

加えて，［ `B類~分断点$ ／`C類~分断点$ ］においては、［ どの先祖も，その `break-inside$p の値は `auto$v0 をとる ］場合に限り，分断が許容される。 ◎ Additionally, breaking at class B or class C break points is allowed only if the break-inside property of all ancestors is auto.

上の拘束により，［［ 内容が`断片容器$から~overflowしない ］ように保つに十分な分断点 ］が供されない場合、 更に分断点を供するため，規則 3 が外される ◎ If the above doesn’t provide enough break points to keep content from overflowing the fragmentainer, then rule 3 is dropped to provide more break points.

それでも，分断点が不足なら、 追加的な分断点を見出すために，規則 1, 2, 4 が外される。 この場合、 ~UAは，新たな分断点の適切さを~~評価するために，［ それらの地点に効果を及ぼす `avoid^v ］を利用してもヨイ。 しかしながら、 この仕様は，その精確な~algoについては示唆しない。 ◎ If that still does not lead to sufficient break points, then rules 1, 2 and 4 are dropped in order to find additional breakpoints. In this case the UA may use the avoids that are in effect at those points to weigh the appropriateness of the new breakpoints; however, this specification does not suggest a precise algorithm.

それでもまだ，分断点が不足なら、 `~cloneされ$た［ ~margin／~border／~padding ］の`塊-終端$ 側が切落され、 それでも不足なら，その`塊-始端$ 側も切落される。 ◎ If even that does not lead to sufficient break points, cloned margins/border/padding at on the block-end side are truncated; and if more room is still needed, cloned margins/border/padding are truncated at the block-start side as well.

最終的に、［ `断片容器$の始めから終わりまでアリな分断点が無い, かつ 内容すべてが`断片容器$に収まり切らない ］場合には、 ~UAは，`断片容器$の辺から内容がはみ出ないように，任意の所で分断してもヨイ。 そのような場合、 ~UAは，`単体的$な要素の~graphic表現を断片に切分けて，その内容を断片化してもヨイ。 しかしながら、 ~UAは，~pageの上端の所で分断しないモノトスル — すなわち，内容の進行を保証するため、 どの`断片容器$にも，少なくとも何らかの内容を配置するモノトスル。 ◎ Finally, if there are no possible break points below the top of the fragmentainer, and not all the content fits, the UA may break anywhere in order to avoid losing content off the edge of the fragmentainer. In such cases, the UA may also fragment the contents of monolithic elements by slicing the element’s graphical representation. However, the UA must not break at the top of the page, i.e. it must place at least some content on each fragmentainer, so that each fragmentainer has a non-zero amount of content, in order to guarantee progress through the content.

4.5. 非強制d分断の最適化-法

~CSSは、［ `断片化~文脈$における`断片容器$の~overflowを避けるため、 `断片~化~flow$は，許容される分断点にて分断するモノトスル ］と要求するが，［ 特定0の`許容される分断$にて，内容を分断するかどうか ］は定義しない。 しかしながら、 ~UAには，次の指針を~~順守することが推奨される（それらには、 所々で矛盾もあることを認識した上で）： ◎ While CSS requires that a fragmented flow must break at allowed break points in order to avoid overflowing the fragmentainers in its fragmentation context, it does not define whether content breaks at a particular allowed break. However, it is recommended that user agents observe the following guidelines (while recognizing that they are sometimes contradictory):

• 分断はアリな限り少なくする。 ◎ Break as few times as possible.
• `強制d分断$で終端しないような，すべての`断片容器$は、 等量の内容で埋まるように現れさせる。 ◎ Make all fragmentainers that don’t end with a forced break appear to be equally filled with content.
• `置換d要素$の内側では、 分断するのを避ける。 ◎ Avoid breaking inside a replaced element.

~CSSにおいては、 次の要件も追加的に課される： ~size 0 の`~box断片$は、 空間を占めないので — 【直前の内容が】`断片容器$の中に収まるならば — 当の`断片化~分断$の前~側に現れるモノトスル。 ◎ Additionally, CSS imposes one requirement: a zero-sized box fragment, since it does not take up space, must appear on the earlier side of a fragmentation break if it is able to fit within the fragmentainer.

注記： ~size 0 の`~box断片$は、 断片容器を~overflowする内容の直後に配置された場合には，次の`断片容器$へ追出されることになる。 ◎ Note: A zero-sized box fragment will be pushed to the next fragmentainer if it is placed immediately after content that itself overflows the fragmentainer.

5.1. ~sizeが一様でない断片容器への分断-法

~flowが，~sizeが一様でない 一連の`断片容器$に断片化されるときには、 ~layoutに順応するため，次の規則が~~順守される： ◎ When a flow is fragmented into varying-size fragmentainers, the following rules are observed for adapting layout:

• ~layoutは、 `断片容器$ごとに遂行される — 各 `断片容器$ %C は、 ~lay-outする要素について，［ 前の分断点からの要素の進捗量を継続しつつ ］， %C 自身の~sizeを利用して，要素~全体が［ 他の`断片容器$の~sizeも %C と同じ~sizeにされて断片化されている ］と~~見なした下で，要素の~sizeと位置を再度~計算する。 進捗量は、［ %C において［ 利用-済みな／残りの 【！＊ `残りの断片容器~塊~size$】 ］`塊~size$が占める百分率（絶対的~長さではなく） ］で, および［ 利用-済みな／残りの ］内容の分量 ］で，測定される。 ただし，`単体的$な要素を~lay-outするときには、 ~UAは，代わりに［ 各 `断片容器$に渡り，［ `行内~size$／解決された`塊~size$ ］を一貫して保守してもヨイ。 ◎ Layout is performed per-fragmentainer, with each fragmentainer continuing progress from the breakpoint on the previous, but recalculating sizes and positions using its own size as if the entire element were fragmented across fragmentainers of this size. Progress is measured in percentages (not absolute lengths) of used/remaining fragmentainer size and in amount of used/remaining content. However, when laying out monolithic elements, the UA may instead maintain a consistent inline size and resolved block size across fragmentainers.
• 要素の内在的~sizeは、 要素~全体に渡って，計算され, 保守される 【すなわち，断片化されないときの~sizeを用いる】 — 内在的~sizeを解決するために初期~包含塊の~sizeを要するときは、 `断片化~文脈$を定義している最初の`断片容器$の~sizeと見做す。 ◎ Intrinsic sizes are calculated and maintained across the entire element. Where an initial containing block size is needed to resolve an intrinsic size, assume the size of the first fragmentainer defining a fragmentation context.

• ［ 前の`断片容器$から始まっている~box ］の断片は、［ それらが，【次の？】`断片容器$の`塊-始端$ 辺の上側に位置してはならない ］とする，追加的な拘束を伴う配置~規則を順守するモノトスル。 その結果，~boxの継続~断片が`断片容器$の`塊-始端$ 辺から離されることになる場合、 `box-decoration-break$p に `clone^v が指定されているならば，その断片を［ ~boxの~paddingと~borderに加えて~margin ］により包装する。 ◎ Fragments of boxes that began on a previous fragmentainer must obey placement rules with the additional constraint that fragments must not be positioned above the block-start edge of the fragmentainer. If this results in a box’s continuation fragment shifting away from the block-start edge of the fragmentainer, then box-decoration-break: clone, if specified, wraps the fragment with the box’s margin in addition to its padding and border.

注記： 一連の要素の文書~順序は，断片化の間は変化しないので、 各~断片は，`連続的~媒体$に適用される規則と同じ規則に従って処理される。 特に、 `浮動体$の順序は，すべての断片に渡って保全され、 CSS 2.1 § 9.5 にて定義される規則と同じ規則に従う。 ◎ Note: Since document order of elements doesn’t change during fragmentation, fragments are processed following the same rules that apply to continuous media. In particular, the order of floats is preserved across all fragments and follows the same rules as defined in CSS 2.1 9.5.

上述の規則が含意するいくつかを以下に挙げる（参考）： ◎ Below are listed (informatively) some implications of these rules:

• ［ `伸張して収まる~size$ ／百分率に基づく~size ］による~layout拘束を充足している~box（~tableも含む）は、 ~page間に渡り，その`行内~size$を変化させ得る。 ◎ Boxes (including tables) fulfilling layout constraints at their stretch-fit or percentage-based size may change inline size across pages.
• ［ `最小-内容$ ／ `最大-内容$ ／ 絶対~長さ ］~sizeによる~layout拘束を充足している~box（~tableも含む）は、 ~page間に渡り，その`行内~size$を保守することになる。 ◎ Boxes (including tables) fulfilling layout constraints at their min-content, max-content, or absolute-length size will maintain their inline size across pages.
• `塊~level$の継続~断片は、 例えば，それが［ 塊~整形~文脈を確立する, かつ `浮動体$の脇に置かれる, かつ それと浮動体の両者が，横並びに置くには狭~過ぎる~page上に継続する ］場合には、 ~pageの始めから置かれてもヨイ。 ◎ A block-level continuation fragment may be placed below the top of the page if, e.g. it establishes a block formatting context and is placed beside a float and both it and the float continue onto a narrower page that is too narrow to hold both of them side-by-side.
• 同じ~page上に先行する`浮動体$ F に隣接な要素は、 例えば，［ この より狭い~page上に継続する別の先行する浮動体 G があって， F, G が，もはや横並びに収まらないために F が下側へ追出される ］ような場合、 次の~pageに継続する浮動体の上側に回込むことがある。 ◎ An element adjacent to a preceding float on one page may wind up above the float’s continuation on the next page if, e.g. that float is pushed down because it no longer fits side-by-side with an earlier float that also continues onto this narrower page.
• 左~浮動体は、 先行する右~浮動体が前の~pageに収まらない場合には，右~浮動体の残りの断片の `前の^em ~page上に現れてもヨイ。 しかしながら，他の右~浮動体は、 先行する右~浮動体の残りの断片を配置し終える所まで，~~先送りされることになる。 ◎ A left float may appear on a page before the remaining fragments of a preceding right float if that right float does not fit on the earlier page. However another right float will be forced down until the preceding right float’s remaining fragment can be placed.

5.2. 分断に連接している~margin： `margin-break^p ~prop

`断片化~分断$にて~boxの`塊-軸$`~margin$を破棄するか保つかを制御する。 各種 値の意味は： ◎ Controls whether the box’s block-axis margins are discarded or kept at a fragmentation break. Values have the following meanings:

`auto@v1

~boxの前／後に`非強制d^em分断が生じるときは、 分断の［ 前／後 ］に連接している~marginを［ `残りの断片容器~塊~size$ ／ 0 ］に切落す。 そこで`強制d分断^emが生じるときは、 分断の［ 前／後 ］に連接している~marginは［ 切落される／保全される ］。 `~cloneされ$た~marginは、 常に 0 に切落される。 ◎ When an unforced break occurs before or after the box, any margins adjoining the break truncate to the remaining fragmentainer extent before the break, and are truncated to zero after the break. When a forced break occurs there, adjoining margins before the break are truncated, but margins after the break are preserved. Cloned margins are always truncated to zero.

注記： `~marginが相殺される＠~CSS2J#collapsing-margins$ときは、 同じ分断に複数の~boxの~marginが連接し得る。 ◎ Note: When margins collapse (see CSS2§8.3.1), the margins of multiple boxes can be adjoining the break.

`keep@v

`断片化~分断$に連接している~marginは、 切落されない。 ◎ Margins adjoining a fragmentation break are not truncated.

`discard@v

`断片化~分断$に連接している~marginは、 常に切落される — `断片化~文脈$の始端や終端にあるものも含めて。 ◎ Margins adjoining a fragmentation break are always truncated, including at the start and end of a fragmentation context.

注記： （~page, 柱, 等々の）`断片化~容器$に適用される `margin-trim$p ~propも見よ。 ◎ Note: See also the margin-trim property, which applies to the fragmentation container (page/column/etc.)

Antenna House は 2 個目の `keep^v ~keywordも許容する — それは、 分断の後にある~marginを保全し，他の場合は破棄する。 この特能は求まれているのか？ また，`keep$v が 1 個だけ指定された場合、 ~marginの前のみ, あるいは両~側のどちらに適用するのか？ `論点＠~CSSissue/3254$を見よ。 ◎ Antenna House also allows a second keep keyword, which preserves the margin after the break; it is otherwise discarded. Do we want to include this feature? Also, if only one keep is specified, does it apply only to the before margin or both sides? See discussion.

<style>
  article { columns: 16ch; border: solid silver; }
  h3 { break-before: always; }
</style>
<article>
ここでは、強制d分断や非強制d分断の前／後における <code>margin-break</code> の効果を比較できる。
この段落は、非強制d分断の後に開始する。
  <h3>この~headingの前には強制d分断が与えられている。</h3>
</article>

code {
  background: silver;
  padding: 0.1em;
  border: 1px solid;
  border-radius: 0.2em;
  margin: 0.2em;
  margin-break: discard;
}

5.3. ~boxの分割-法

~boxを分断するときは、 その分断の前の内容に対する~boxは，`残りの断片容器~塊~size$を埋めるように拡がる（ `box-decoration-break$p: `clone^v により適用される ~margin／~border／~padding 用の部屋は残す） — 内容を次の`断片容器$にて再開させる前に。 （内容を，次の`断片容器$に追出すような`分断$は、 ~boxの内容の`塊~size$を，実質的に増大させる。） ◎ When a box breaks, its content box extends to fill any remaining fragmentainer extent (leaving room for any margins/borders/padding applied by box-decoration-break: clone) before the content resumes on the next fragmentainer. (A fragmentation break that pushes content to the next fragmentainer effectively increases the block size of a box’s contents.)

注記： ~boxの断片化により供与される`塊~size$の増分（すなわち，分断点から`断片容器$の辺までの距離）は、 ~boxの`塊~size$に指定された上限への進捗量を供与する。 ◎ Note: The extra block size contributed by fragmenting the box (i.e. the distance from the break point to the edge of the fragmentainer) contributes progress towards any specified limits on the box’s block size.

5.4. ~borderと背景の断片化： `box-decoration-break^p ~prop

`box-decoration-break$p ~propは、 （~page／柱／領域／行l 【！ISSUE-182】 ）分断が~boxを分割する下で，次を制御する： ◎ When a break (page/column/region/line) splits a box, the box-decoration-break property controls

• ~boxの［ ~margin／~border／~padding ］および他の装飾が，各~box断片の分断辺【 “切り口” 】を包装するかどうか。 ◎ whether the box’s margins, borders, padding, and other decorations wrap the broken edges of the box fragments
• 各~box断片から`背景~位置決め区画$ `CSS-BACKGROUNDS-3$r （あるいは、 `~mask位置決め区画$ `CSS-MASKING-1$r, `図形の基準~box$ `CSS-SHAPES-1$r, 等々）を導出したり複数化する方法, および その中に要素の背景を描く方法。 ◎ how the background positioning area [CSS-BACKGROUNDS-3] (and mask positioning area [CSS-MASKING-1], shape reference box [CSS-SHAPES-1], etc.) is derived from or duplicated across the box fragments and how the element’s background is drawn within them.

各種 値の意味は： ◎ Values have the following meanings:

`clone@v

各~box断片は、［ ~border, ~padding, ~margin ］により，独立に包装される。 `border-radius$p, `border-image$p, `box-shadow$p があれば，それらは各~断片ごとに独立に適用される。 背景は、 要素の各~断片の中に独立に描かれる。 したがって， `no-repeat^v による背景~画像は，要素の断片ごとに描画されることになる。 ◎ Each box fragment is independently wrapped with the border, padding, and margin. The border-radius and border-image and box-shadow, if any, are applied to each fragment independently. The background is drawn independently in each fragment of the element. A no-repeat background image will thus be rendered once in each fragment of the element.

注記： ~cloneされる~marginは、 塊~levelの~box上では`切落される＠#break-margins$。 ◎ Note: Cloned margins are truncated on block-level boxes.

`slice@v

要素が分断されずに描画された上で，分断で切分けられたかのような効果になる： 分断辺の所には，~borderも~paddingも挿入されず, `box-shadow$p は描かれず、［ 背景, `border-radius$p, `border-image$p ］は、 ~box全体の幾何が分断されていないかのように適用される。 ◎ The effect is as though the element were rendered with no breaks present, and then sliced by the breaks afterward: no border and no padding are inserted at a break; no box-shadow is drawn at a broken edge; and backgrounds, border-radius, and the border-image are applied to the geometry of the whole box as if it were unbroken.

注記： 行内~要素に対しては、 断片のどの側が分断辺と見なされるかは、 親~要素の行内~進行~方向により決定される。 例えば，［ 親の `direction$p `CSS-WRITING-MODES-3$r が `rtl^v にされている行内~要素 ］が 2 行lに分断される場合、 最初の行l上の断片の `左端^em 【！＊ left^v】 辺が，分断辺になる（特に、 要素~自身, および その`包含塊$の `direction$p は利用されないことに注意）。 ◎ Note: For inline elements, which side of a fragment is considered the broken edge is determined by the parent element’s inline progression direction. For example, if an inline element whose parent has direction: rtl breaks across two lines, the left edge of the fragment on the first line will be the broken edge. (Note in particular that neither the element’s own direction nor its containing block’s direction is used.) See [CSS-WRITING-MODES-3].

5.5. 変形, 位置決め, ~page割り

断片化は~layoutと相互作用し、 したがって［ 相対~位置決め `CSS2$r, 変形 `CSS-TRANSFORMS-1$r, その他 ］による，どの~graphic上の効果よりも`前に^em生じる。 その種の効果は，断片ごとに適用される： 例えば，断片化された~boxに回転を適用するときは、 各~断片について 回転の原点を計算した上で, それぞれの原点を中心に独立に回転させることになる。 （~overflow部分のみからなる断片の原点は、 内容が，`断片容器$の始端にある［［ ~margin／~border／~padding ］が 0 幅にされた空な~box ］を~overflowしていたかのように，決定される。） しかしながら，印刷-時の~datalossを抑えるため、 ~page~boxによる分離と移転は，最後に生じる`ベキである^em。 したがって，変形された断片が何~pageかにまたがる場合、 `~page分断$の所で切分けられた上で、 その出自の~pageの外側を切り取るのではなく，その全体像が印刷される`ベキである^em。 ◎ Fragmentation interacts with layout, and thus occurs before relative positioning [CSS2], transforms [CSS-TRANSFORMS-1], and any other graphical effects. Such effects are applied per fragment: for example, rotation applied to a fragmented box will calculate a rotation origin for each fragment and independently rotate that fragment around its origin. (The origin of an overflow-only fragment is determined as if that content were overflowing an empty box with zero margins/borders/padding at the start of the fragmentainer.) However, in order to reduce dataloss when printing, the separation and transfer of page boxes should occur last; thus a transformed fragment that spans pages should be sliced at the page breaks and print in its entirety rather than being clipped by its originating page.

絶対的~位置決めは~layoutに影響し，したがって断片化と相互作用する。 ある`包含塊$に属する［ 座標系, 絶対的に位置された~box ］のいずれも、 その包含塊と同じ断片化~flowの下で，一連の断片容器に断片化されることになる。 ◎ Absolute positioning affects layout and thus interacts with fragmentation. Both the coordinate system and absolutely-positioned boxes belonging to a containing block will fragment across fragmentainers in the same fragmentation flow as the containing block.

~UA には、［ `分断$に~spanする~boxのうち，その`塊-始端$ 辺の位置が ~boxの内容~断片の場所に依存するもの ］については、 正しく位置させることは要求されない。 ◎ UAs are not required to correctly position boxes that span a fragmentation break and whose block-start edge position depends on where the box’s content fragments.

［ 文書~全体を記憶して操作できないような拘束 ］がある~UAには、［ 前に描画された~page上で終わるような，絶対的に位置された要素 ］を正しく位置させることは要求されない。 ◎ UAs with memory constraints that prevent them from manipulating an entire document in memory are not required to correctly position absolutely-positioned elements that end up on a previously-rendered page.

~level 3 からの変更点

`~level 3＠~CSSWG/css-break-3/$ 以降に，次の特能が追加された： ◎ The following features have been added since CSS Fragmentation Level 3:

• `margin-break$p ~prop。 ◎ The margin-break property.
• ［ `break-before$p ／ `break-after$p ］用の値［ `always$v, `all$v ］。 ◎ The always and all values of break-before/break-after.