@@ -89,7 +89,7 @@ <h2 class="no-num no-toc" id="status">Status of this document</h2>
8989
9090< p > The following features are at-risk and may be dropped at the
9191end of the CR period if there has not been enough interest from
92- implementers: 'box-decoration-break', animatability of 'box-shadow'
92+ implementers: animatability of 'box-shadow'
93
10BC0
93
9494< p > The CSS WG maintains an < a href ="http://www.w3.org/Style/CSS/Tracker/products/11 "> issues
9595list</ a > for this module. A < a href ="http://www.w3.org/Style/CSS/Test/ "> test
@@ -129,7 +129,7 @@ <h2 id="introduction">Introduction</h2>
129129Additionally the box may be given a "drop-shadow" effect with the
130130'box-shadow' property.
131131
132- < p > If an element is broken into multiple boxes, 'box-decoration-break'
132+ < p > If an element is broken into multiple boxes, 'box-decoration-break' [[CSS3-BREAK]]
133133defines how the borders and background are divided over the various boxes.
134134(An element can result in more than one box if it is broken at the
135135end of a line, at the end of a column or at the end of a page; and
@@ -958,9 +958,10 @@ <h3 id="the-background-origin">Positioning Area: the 'background-origin' propert
958958
959959< p > For elements rendered as a single box, specifies the
960960< dfn id ="background-positioning-area "> background positioning area</ dfn > .
961- For elements rendered as multiple boxes (e.g., inline boxes on several
962- lines, boxes on several pages) specifies which boxes 'box-decoration-break'
963- operates on to determine the background positioning area(s).
961+ For elements rendered as multiple boxes
962+ (e.g., inline boxes on several lines, boxes on several pages),
963+ specifies which boxes 'box-decoration-break' [[CSS3-BREAK]] operates on
964+ to determine the background positioning area(s).
964965
965966< dl >
966967 < dt > < dfn title ="''padding-box''!!'background-origin' value ">
@@ -2751,119 +2752,10 @@ <h3 id=border-image-tables>Effect on Tables</h3>
27512752
27522753< h2 id ="misc "> Miscellaneous Effects</ h2 >
27532754
2754- < h3 id ="the-box-decoration-break "> Drawing at Breaks: the 'box-decoration-break' property</ h3 >
2755-
2756- < table class =propdef >
2757- < tr >
2758- < th > Name:
2759- < td > < dfn > box-decoration-break</ dfn >
2760- < tr >
2761- < th > < a href ="#values "> Value</ a > :
2762- < td > slice | clone
2763- < tr >
2764- < th > Initial:
2765- < td > slice
2766- < tr >
2767- < th > Applies to:
2768- < td > all elements
2769- < tr >
2770- < th > Inherited:
2771- < td > no
2772- < tr >
2773- < th > Percentages:
2774- < td > N/A
2775- < tr >
2776- < th > Media:
2777- < td > visual
2778- < tr >
2779- < th > Computed value:
2780- < td > as specified
2781- < tr >
2782- < th > Animatable:
2783- < td > no
2784- </ table >
2785-
2786- < p > When a box is broken at a page break, column break, or, for inline
2787- elements, at a line break<!-- ISSUE-182--> , the
2788- 'box-decoration-break' property specifies
2789- whether box fragments are treated as broken fragments of one continuous box,
2790- or whether each fragment is individually wrapped with the border and padding.
2791- For backgrounds it defines how the < span class =index > background
2792- positioning area</ span > is derived from these multiple fragments and how
2793- the element's background is drawn within them. Values have the following
2794- meanings:
2795-
2796- < dl >
2797- < dt > < dfn > ''clone''</ dfn >
2798- < dd > Each box fragment is independently wrapped with the border and padding.
2799- The 'border-radius' and 'border-image' and 'box-shadow', if any,
2800- are applied to each fragment independently. The background is drawn
2801- independently in each fragment of the element. A no-repeat background
2802- image will thus be rendered once in each fragment of the element.
2803-
2804- < dt > < dfn > ''slice''</ dfn >
2805- < dd > < p > No border and no padding are inserted at a break. No box-shadow
2806- is drawn at a broken edge; 'border-radius' does not apply to its
2807- corners; and the 'border-image' is rendered for the whole box as if
2808- it were unbroken. The effect is as though the element were rendered
2809- with no breaks present, and then sliced by the breaks afterward.
2810-
2811- < p > Backgrounds are drawn as if, after the element has been laid out
2812- (including any justification, bidi reordering, page breaks, etc.),
2813- all the element's box fragments were taken and put one after the
2814- other in visual order. The background is applied to the bounding box
2815- of this composite box and then the fragments are put back, with each
2816- with its share of the background.</ p >
2817-
2818- < p > For boxes broken across lines, first fragments on the same line are
2819- connected in visual order. Then fragments on subsequent lines are
2820- ordered according to the element's inline progression direction and
2821- aligned on the baseline.
2822- For example in a left-to-right containing block ('direction' is
2823- ''ltr''), the first fragment is the leftmost fragment on the first
2824- line and fragments from subsequent lines are put to the right of it.
2825- In a right-to-left containing block, the first fragment is the
2826- rightmost on the first line and subsequent fragments are put to the
2827- left of it.</ p >
2828-
2829- < p > For boxes broken across columns, the columns are treated as
2830- one continuous element, as if the column boxes were glued together
2831- in the block progression direction of the multi-column element.
2832- For boxes broken across pages, the page content areas are glued
2833- together in the block progression direction of the root element.
2834- In these cases, if the box fragments have different widths (heights,
2835- if the root element / multi-column element is in a vertical writing
2836- mode), then each piece draws its background assuming that the
2837- whole element has the same width (height) as this piece. This
2838- ensures that right-aligned images stay aligned to the right edge,
2839- left-aligned images stay aligned to the left edge, and centered
2840- images stay centered.
2841- </ dl >
2842-
2843- < div class ="figure ">
2844- < p > < img alt ="Illustration: (1) a single box cut in two in between
2845- two lines of text by a page break and (2) two boxes, one before and
2846- one after the page break, both with a border all around and their
2847- own background image " src ="box-break.png ">
2848-
2849- < p class =caption > Two possibilities for
2850- 'box-decoration-break': on the left, the value
2851- ''slice'', on the right the value ''clone''.
2852- <
8096
/ div >
2853-
28542755< p class =note >
2855- For inline elements, which side of a fragment is the broken edge is
2856- determined by the parent element's inline progression direction.
2857- For example, if an inline element whose parent has ''direction: rtl''
2858- breaks across two lines, the < em > left</ em > edge of the fragment on
2859- the first line will be the broken edge. (Note in particular that
2860- neither the element's own 'direction' nor its containing block's
2861- 'direction' is used.) See [[CSS3-WRITING-MODES]].
2862-
2863- < p > UAs may also apply 'box-decoration-break' to control rendering
2864- at bidi-imposed breaks, i.e. when bidi reordering causes an inline
2865- to split into non-contiguous fragments. Otherwise such breaks are
2866- always handled as ''slice''.
2756+ The 'box-decoration-break' property,
2757+ which defines how backgrounds and borders apply to a fragmented box,
2758+ has been moved to the < a href ="http://www.w3.org/TR/css3-break/ "> CSS Fragmentation Module</ a > . [[CSS3-BREAK]]
28672759
28682760< h3 id ="the-box-shadow "> Drop Shadows: the 'box-shadow' property</ h3 >
28692761
0 commit comments