1- <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
1+ <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
22"http://www.w3.org/TR/html4/strict.dtd">
33
44< html lang =en >
5858
5959 < h1 > CSS Positioned Layout Module Level 3</ h1 >
6060
61- < h2 class ="no-num no-toc " id =longstatus-date > Editor's Draft 11 November
62- 2011 </ h2 >
61+ < h2 class ="no-num no-toc " id =longstatus-date > Editor's Draft 3 February
62+ 2012 </ h2 >
6363
6464 < dl >
6565 < dt > This version:
6666
6767 < dd > < a
68- href ="http://www.w3.org/TR/2011 /ED-css3-positioning-20111111 / "> http://dev.w3.org/csswg/css3-positioning/</ a >
68+ href ="http://www.w3.org/TR/2012 /ED-css3-positioning-20120203 / "> http://dev.w3.org/csswg/css3-positioning/</ a >
6969
7070 < dt > Latest version:
7171
@@ -94,7 +94,7 @@ <h2 class="no-num no-toc" id=longstatus-date>Editor's Draft 11 November
9494 <!--begin-copyright-->
9595 < p class =copyright id =copyright-copy-year-2000-w3creg-mit-erci > < a
9696 href ="http://www.w3.org/Consortium/Legal/ipr-notice#Copyright "
97- rel =license > Copyright</ a > © 2011 < a
97+ rel =license > Copyright</ a > © 2012 < a
9898 href ="http://www.w3.org/ "> < acronym
9999 title ="World Wide Web Consortium "> W3C</ acronym > </ a > < sup > ®</ sup > (< a
100100 href ="http://www.csail.mit.edu/ "> < acronym
@@ -244,73 +244,67 @@ <h2 class="no-num no-toc" id=contents>Table of contents</h2>
244244 positioning details</ a >
245245 < ul class =toc >
246246 < li id =the-width-of-absolute-page-or-fixed-posi > < a
247- href ="#width-of-absolute-non-replaced-elements "> < span class =secno > 7.1.
248- </ span > The width of absolute, page or fixed positioned, non-replaced
249- elements</ a >
247+ href ="#abs-non-replaced-width "> < span class =secno > 7.1. </ span > The width
248+ of absolute, page or fixed positioned, non-replaced elements</ a >
250249
251250 < li id =the-width-of-a-center-positioned-non-rep > < a
252- href ="#width-of-center-positioned-non-replaced-elements "> < span
253- class =secno > 7.2. </ span > The width of a center positioned, non-replaced
254- elements</ a >
251+ href ="#center-non-replaced-width "> < span class =secno > 7.2. </ span > The
252+ width of a center positioned, non-replaced elements</ a >
255253
256254 < li id =the-width-of-absolute-page-or-fixed-posi0 > < a
257- href ="#width-of-absolute-replaced-elements "> < span class =secno > 7.3.
258- </ span > The width of absolute, page or fixed positioned, replaced
259- elements</ a >
255+ href ="#abs-replaced-width "> < span class =secno > 7.3. </ span > The width of
256+ absolute, page or fixed positioned, replaced elements</ a >
260257
261258 < li id =the-width-of-a-center-positioned-replace > < a
262- href ="#width-of- center-replaced-elements "> < span class =secno > 7.4.
263- </ span > The width of a center positioned, replaced elements</ a >
259+ href ="#center-replaced-width "> < span class =secno > 7.4. </ span > The width
260+ of a center positioned, replaced elements</ a >
264261
265262 < li id =the-height-of-absolute-page-or-fixed-pos > < a
266- href ="#height-of-absolute- non-replaced-elements "> < span class =secno > 7.5.
267- </ span > The height of absolute, page or fixed positioned, non-replaced
268- elements </ a >
263+ href ="#abs- non-replaced-height "> < span class =secno > 7.5. </ span > The
264+ height of absolute, page or fixed positioned, non-replaced elements </ a >
265+
269266
270267 < li id =the-height-of-a-center-positioned-non-re > < a
271- href ="#height-of- center-non-replaced-elements "> < span class =secno > 7.6.
272- </ span > The height of a center positioned, non-replaced elements</ a >
268+ href ="#center-non-replaced-height "> < span class =secno > 7.6. </ span > The
269+ height of a center positioned, non-replaced elements</ a >
273270
274271 < li id =the-height-of-absolute-page-or-fixed-pos0 > < a
275- href ="#height-of-absolute-replaced-elements "> < span class =secno > 7.7.
276- </ span > The height of absolute, page or fixed positioned, replaced
277- elements</ a >
272+ href ="#abs-replaced-height "> < span class =secno > 7.7. </ span > The height of
273+ absolute, page or fixed positioned, replaced elements</ a >
278274
279275 < li id =the-height-of-a-center-positioned-replac > < a
280- href ="#height-of- center-replaced-elements "> < span class =secno > 7.8.
281- </ span > The height of a center positioned, replaced elements</ a >
276+ href ="#center-replaced-height "> < span class =secno > 7.8. </ span > The height
277+ of a center positioned, replaced elements</ a >
282278
283279 < li id =auto-heights-for-block-formatting-contex > < a
284- href ="#auto -height-for-block-formatting-context-roots "> < span
285- class =secno > 7.9. </ span > ‘ < code class = property > Auto</ code > ’
286- heights for block formatting context roots</ a >
280+ href ="#root -height "> < span class = secno > 7.9. </ span > ‘ < code
281+ class =property > Auto</ code > ’ heights for block formatting context
282+ roots</ a >
287283 </ ul >
288284
289285 < li id =relationships-between-display-position-a > < a
290- href ="#relationship-between-display-position-float "> < span class =secno > 8.
291- </ span > Relationships between ‘< code
292- class =property > display</ code > ’, ‘< code
286+ href ="#dis-pos-flo "> < span class =secno > 8. </ span > Relationships between
287+ ‘< code class =property > display</ code > ’, ‘< code
293288 class =property > position</ code > ’, and ‘< code
294289 class =property > float</ code > ’</ a >
295290
296291 < li id =comparison-of-normal-flow-floats-and-pos > < a
297- href ="#comparison-of-flow-floats-absolute-positioning "> < span
298- class =secno > 9. </ span > Comparison of normal flow, floats, and
299- positioning</ a >
292+ href ="#comparison "> < span class =secno > 9. </ span > Comparison of normal flow,
293+ floats, and positioning</ a >
300294 < ul class =toc >
301- < li id =normal-flow-0 > < a href ="#normal-flow-example "> < span
302- class = secno > 9.1. </ span > Normal flow</ a >
295+ < li id =normal-flow-0 > < a href ="#comp- normal-flow "> < span class = secno > 9.1.
296+ </ span > Normal flow</ a >
303297
304- < li id =relative-positioning-0 > < a href ="#rel-position "> < span
298+ < li id =relative-positioning-0 > < a href ="#comp-relpos "> < span
305299 class =secno > 9.2. </ span > Relative positioning</ a >
306300
307- < li id =floating-a-box- > < a href ="#floating-box "> < span class =secno > 9.3.
301+ < li id =floating-a-box- > < a href ="#comp-floating "> < span class =secno > 9.3.
308302 </ span > Floating a box</ a >
309303
310- < li id =absolute-positioning-0 > < a href ="#abs-positioning "> < span
304+ < li id =absolute-positioning-0 > < a href ="#comp-abspos "> < span
311305 class =secno > 9.4. </ span > Absolute positioning</ a >
312306
313- < li id =page-positioning-0 > < a href ="#page-pos "> < span class =secno > 9.5.
307+ < li id =page-positioning-0 > < a href ="#comp-pagepos "> < span class =secno > 9.5.
314308 </ span > Page positioning</ a >
315309 </ ul >
316310
@@ -1873,9 +1867,8 @@ <h3 id=box-offsets-trbl><span class=secno>6.7. </span>Box offsets:
18731867 < h2 id =size-and-position-details > < span class =secno > 7. </ span > Sizing and
18741868 positioning details</ h2 >
18751869
1876- < h3 id =width-of-absolute-non-replaced-elements > < span class =secno > 7.1.
1877- </ span > The width of absolute, page or fixed positioned, non-replaced
1878- elements</ h3 >
1870+ < h3 id =abs-non-replaced-width > < span class =secno > 7.1. </ span > The width of
1871+ absolute, page or fixed positioned, non-replaced elements</ h3 >
18791872
18801873 < p id =the-constraint-that-determines-the-used- > The constraint that
18811874 determines the used values for these elements is:
@@ -1999,9 +1992,8 @@ <h3 id=width-of-absolute-non-replaced-elements><span class=secno>7.1.
19991992 </ ol >
20001993 <!-- End section: The width of absolute, page or fixed positioned, non-replaced element -->
20011994
2002- < h3 id =width-of-center-positioned-non-replaced-elements > < span
2003- class =secno > 7.2. </ span > The width of a center positioned, non-replaced
2004- elements</ h3 >
1995+ < h3 id =center-non-replaced-width > < span class =secno > 7.2. </ span > The width of
1996+ a center positioned, non-replaced elements</ h3 >
20051997
20061998 < p id =the-following-constraints-must-hold-amon > The following constraints
20071999 must hold among the used values of the other properties:
@@ -2106,8 +2098,8 @@ <h3 id=width-of-center-positioned-non-replaced-elements><span
21062098 </ ol >
21072099 <!-- End section: The width of a center positioned, non-replaced element -->
21082100
2109- < h3 id =width-of-absolute- replaced-elements > < span class =secno > 7.3.
2110- </ span > The width of absolute, page or fixed positioned, replaced elements</ h3 >
2101+ < h3 id =abs- replaced-width > < span class =secno > 7.3. </ span > The width of
2102+ absolute, page or fixed positioned, replaced elements</ h3 >
21112103
21122104 < p id =if-height-and-width-both-have-computed-v > If ‘< code
21132105 class =property > height</ code > ’ and ‘< code
@@ -2230,23 +2222,21 @@ <h3 id=width-of-absolute-replaced-elements><span class=secno>7.3.
22302222 </ ol >
22312223 <!-- End section: The width of absolute, page or fixed positioned, replaced element -->
22322224
2233- < h3 id =width-of- center-replaced-elements > < span class =secno > 7.4. </ span > The
2234- width of a center positioned, replaced elements</ h3 >
2225+ < h3 id =center-replaced-width > < span class =secno > 7.4. </ span > The width of a
2226+ center positioned, replaced elements</ h3 >
22352227
22362228 < p id =the-used-value-for-width-is-determined-a > The used value for
22372229 ‘< code class =property > width</ code > ’ is determined as for "< a
2238- href ="#width-of-absolute- replaced-elements "> The width of absolute, page or
2239- fixed positioned, replaced elements</ a > ".
2230+ href ="#abs- replaced-width "> The width of absolute, page or fixed
2231+ positioned, replaced elements</ a > ".
22402232
22412233 < p id =then-the-rules-for-the-width-of-a-center > Then the rules for "< a
2242- href ="#width-of-center-positioned-non-replaced-elements "> The width of a
2243- center positioned, non-replaced elements</ a > " are applied to determine the
2244- centering.</ p >
2234+ href ="#center-non-replaced-width "> The width of a center positioned,
2235+ non-replaced elements</ a > " are applied to determine the centering.</ p >
22452236 <!-- End section: The width of a center positioned, replaced element -->
22462237
2247- < h3 id =height-of-absolute-non-replaced-elements > < span class =secno > 7.5.
2248- </ span > The height of absolute, page or fixed positioned, non-replaced
2249- elements</ h3 >
2238+ < h3 id =abs-non-replaced-height > < span class =secno > 7.5. </ span > The height of
2239+ absolute, page or fixed positioned, non-replaced elements</ h3 >
22502240
22512241 < p id =for-absolutely-positioned-elements-the-u > For absolutely positioned
22522242 elements, the used values of the vertical dimensions must satisfy this
@@ -2347,8 +2337,8 @@ <h3 id=height-of-absolute-non-replaced-elements><span class=secno>7.5.
23472337 </ ol >
23482338 <!-- End section: The height of absolute, page or fixed positioned, non-replaced element -->
23492339
2350- < h3 id =height-of- center-non-replaced-elements > < span class =secno > 7.6.
2351- </ span > The height of a center positioned, non-replaced elements</ h3 >
2340+ < h3 id =center-non-replaced-height > < span class =secno > 7.6. </ span > The height
2341+ of a center positioned, non-replaced elements</ h3 >
23522342
23532343 < p id =the-following-constraints-must-hold-amon0 > The following constraints
23542344 must hold among the used values of the other properties:
@@ -2453,8 +2443,8 @@ <h3 id=height-of-center-non-replaced-elements><span class=secno>7.6.
24532443 </ ol >
24542444 <!-- End section: The height of a 'center' positioned, non-replaced element -->
24552445
2456- < h3 id =height-of-absolute- replaced-elements > < span class =secno > 7.7.
2457- </ span > The height of absolute, page or fixed positioned, replaced elements</ h3 >
2446+ < h3 id =abs- replaced-height > < span class =secno > 7.7. </ span > The height of
2447+ absolute, page or fixed positioned, replaced elements</ h3 >
24582448
24592449 < p id =if-height-and-width-both-have-computed-v2 > If ‘< code
24602450 class =property > height</ code > ’ and ‘< code
@@ -2522,29 +2512,28 @@ <h3 id=height-of-absolute-replaced-elements><span class=secno>7.7.
25222512 </ ol >
25232513 <!-- End section: The height of absolute, page or fixed positioned, replaced element -->
25242514
2525- < h3 id =height-of- center-replaced-elements > < span class =secno > 7.8. </ span > The
2526- height of a center positioned, replaced elements</ h3 >
2515+ < h3 id =center-replaced-height > < span class =secno > 7.8. </ span > The height of a
2516+ center positioned, replaced elements</ h3 >
25272517
25282518 < p id =the-used-value-for-height-is-determined- > The used value for
25292519 ‘< code class =property > height</ code > ’ is determined as for "< a
2530- href ="#height-of-absolute- replaced-elements "> The height of absolute, page
2531- or fixed positioned, replaced elements</ a > ".
2520+ href ="#abs- replaced-height "> The height of absolute, page or fixed
2521+ positioned, replaced elements</ a > ".
25322522
25332523 < p id =then-the-rules-for-the-height-of-a-cente > Then the rules for "< a
2534- href ="#height-of-center-non-replaced-elements "> The height of a center
2535- positioned, non-replaced elements</ a > " are applied to determine the
2536- centering.</ p >
2524+ href ="#center-non-replaced-height "> The height of a center positioned,
2525+ non-replaced elements</ a > " are applied to determine the centering.</ p >
25372526 <!-- End section: The height of a center positioned, replaced element -->
25382527
2539- < h3 id =auto -height-for-block-formatting-context-roots > < span
2540- class =secno > 7.9. </ span > ‘ < code class = property > Auto</ code > ’
2541- heights for block formatting context roots</ h3 >
2528+ < h3 id =root -height> < span class = secno > 7.9. </ span > ‘ < code
2529+ class =property > Auto</ code > ’ heights for block formatting context
2530+ roots</ h3 >
25422531
25432532 < p id =in-certain-cases-see-e.g.-the-height-of- > In certain cases (see,
2544- e.g., < a href ="#height-of-absolute- non-replaced-elements "> The height of
2545- absolute, page or fixed positioned, non-replaced element</ a > above), the
2546- height of an element that establishes a block formatting context is
2547- computed as follows:
2533+ e.g., < a href ="#abs- non-replaced-height "> The height of absolute, page or
2534+ fixed positioned, non-replaced element</ a > above), the height of an
2535+ element that establishes a block formatting context is computed as
2536+ follows:
25482537
25492538 < p id =if-it-only-has-inline-level-children-the > If it only has inline-level
25502539 children, the height is the distance between the top of the topmost line
@@ -2571,11 +2560,10 @@ <h3 id=auto-height-for-block-formatting-context-roots><span
25712560 <!-- End section: 'Auto' heights for block formatting context roots -->
25722561 <!-- End section: Sizing and positioning details -->
25732562
2574- < h2 id =relationship-between-display-position-float > < span class =secno > 8.
2575- </ span > Relationships between ‘< code
2576- class =property > display</ code > ’, ‘< a href ="#position "> < code
2577- class =property > position</ code > </ a > ’, and ‘< a
2578- href ="#floats0 "> < code class =property > float</ code > </ a > ’</ h2 >
2563+ < h2 id =dis-pos-flo > < span class =secno > 8. </ span > Relationships between
2564+ ‘< code class =property > display</ code > ’, ‘< a
2565+ href ="#position "> < code class =property > position</ code > </ a > ’, and
2566+ ‘< a href ="#floats0 "> < code class =property > float</ code > </ a > ’</ h2 >
25792567
25802568 < p id =the-three-properties-that-affect-box-gen > The three properties that
25812569 affect box generation and layout — ‘< code
@@ -2663,8 +2651,8 @@ <h2 id=relationship-between-display-position-float><span class=secno>8.
26632651 handling of the relationship with positioning and floats.</ p >
26642652 <!-- End section: Relationships between 'display', 'position', and 'float' -->
26652653
2666- < h2 id =comparison-of-flow-floats-absolute-positioning > < span class =secno > 9.
2667- </ span > Comparison of normal flow, floats, and positioning</ h2 >
2654+ < h2 id =comparison > < span class =secno > 9. </ span > Comparison of normal flow,
2655+ floats, and positioning</ h2 >
26682656
26692657 < p id =this-section-is-not-normative.0 > < em > This section is not
26702658 normative.</ em >
@@ -2717,7 +2705,7 @@ <h2 id=comparison-of-flow-floats-absolute-positioning><span class=secno>9.
27172705 href ="#positioning-schemes1 "> positioning schemes</ a > , and are not intended
27182706 to be reference renderings of the examples given.
27192707
2720- < h3 id =normal-flow-example > < span class =secno > 9.1. </ span > Normal flow</ h3 >
2708+ < h3 id =comp- normal-flow> < span class =secno > 9.1. </ span > Normal flow</ h3 >
27212709
27222710 < p id =consider-the-following-css-declarations- > Consider the following CSS
27232711 declarations for < em > outer</ em > and < em > inner</ em > that do not alter the
@@ -2747,7 +2735,7 @@ <h3 id=normal-flow-example><span class=secno>9.1. </span>Normal flow</h3>
27472735 </ div >
27482736 <!-- End section: Normal flow -->
27492737
2750- < h3 id =rel-position > < span class =secno > 9.2. </ span > Relative positioning</ h3 >
2738+ < h3 id =comp-relpos > < span class =secno > 9.2. </ span > Relative positioning</ h3 >
27512739
27522740 < p id =to-see-the-effect-of-relative-positionin > To see the effect of < a
27532741 href ="#relative-positioning1 " title ="relative positioning "> relative
@@ -2792,7 +2780,7 @@ <h3 id=rel-position><span class=secno>9.2. </span>Relative positioning</h3>
27922780 text would have overlapped.</ p >
27932781 <!-- End section: Relative positioning -->
27942782
2795- < h3 id =floating-box > < span class =secno > 9.3. </ span > Floating a box</ h3 >
2783+ < h3 id =comp-floating > < span class =secno > 9.3. </ span > Floating a box</ h3 >
27962784
27972785 < p id =now-consider-the-effect-of-floating-the- > Now consider the effect of
27982786 < a href ="http://www.w3.org/TR/CSS2/visuren.html#floats "> floating</ a > the
@@ -2891,7 +2879,7 @@ <h3 id=floating-box><span class=secno>9.3. </span>Floating a box</h3>
28912879 </ div >
28922880 <!-- End section: floating a box -->
28932881
2894- < h3 id =abs-positioning > < span class =secno > 9.4. </ span > Absolute positioning</ h3 >
2882+ < h3 id =comp-abspos > < span class =secno > 9.4. </ span > Absolute positioning</ h3 >
28952883
28962884 < p id =next-we-consider-the-effect-of-absolute- > Next, we consider the
28972885 effect of absolute positioning. Consider the following CSS declarations
@@ -3039,7 +3027,7 @@ <h3 id=abs-positioning><span class=secno>9.4. </span>Absolute positioning</h3>
30393027 change bars seem to "float" to the left of the current line.</ p >
30403028 <!-- End section: Absolute positoining -->
30413029
3042- < h3 id =page-pos > < span class =secno > 9.5. </ span > Page positioning</ h3 >
3030+ < h3 id =comp-pagepos > < span class =secno > 9.5. </ span > Page positioning</ h3 >
30433031
30443032 < p id =finally-we-consider-the-effect-of-page-p > Finally, we consider the
30453033 effect of page positioning. Consider the following CSS declarations for
@@ -3998,11 +3986,11 @@ <h3 class=no-num id=normative-references>Normative references</h3>
39983986
39993987 < dt id =CSS3-REGIONS > [CSS3-REGIONS]
40003988
4001- < dd > Vincent Hardy. < a
4002- href ="http://www.w3.org/TR/2011/WD-css3-regions-20110609 / "> < cite > CSS
4003- Regions Module.</ cite > </ a > 9 June 2011. W3C Working Draft. (Work in
4004- progress.) URL: < a
4005- href ="http://www.w3.org/TR/2011/WD-css3-regions-20110609 / "> http://www.w3.org/TR/2011/WD-css3-regions-20110609 /</ a >
3989+ < dd > Vincent Hardy; Alex Mogilevsky . < a
3990+ href ="http://www.w3.org/TR/2011/WD-css3-regions-20111129 / "> < cite > CSS
3991+ Regions Module Level 3 .</ cite > </ a > 29 November 2011. W3C Working Draft.
3992+ (Work in progress.) URL: < a
3993+ href ="http://www.w3.org/TR/2011/WD-css3-regions-20111129 / "> http://www.w3.org/TR/2011/WD-css3-regions-20111129 /</ a >
40063994 </ dd >
40073995 <!---->
40083996
0 commit comments