File tree Expand file tree Collapse file tree
css3-positioning/longdesc Expand file tree Collapse file tree Original file line number Diff line number Diff line change @@ -47,4 +47,4 @@ <h1>Long description for example illustrating positioning with respect to a posi
4747 </ p >
4848 < p > < a href ="../Overflow.html#img-flow-abs-rel "> Return to image.</ a > </ p >
4949 </ body >
50- </ html >
50+ </ html >
Original file line number Diff line number Diff line change 1+ <!DOCTYPE html>
2+ < html >
3+ < head >
4+ < title > Long description illustrating absolute positioning with respect to the initial containing block</ title >
5+ </ head >
6+ < body >
7+ < h1 > Long description illustrating absolute positioning with respect to the initial containing block</ h1 >
8+ < p >
9+ This diagram illustrates the effects of absolutely positioning a box with respect to the
10+ initial containing block.
11+ </ p >
12+ < p >
13+ A document window is shown, with 8 lines (numbered 1 to 8), each 24px high. All body and
14+ "outer" text has been flowed into lines into lines 1, 2, and 3. The "inner" box has been
15+ positioned at "-100, 200" relative to the "0, 0" coordinates (the upper left corner of
16+ the document window). Most of the "inner" box contents are therefore rendered outside
17+ the document window.
18+ </ p >
19+ < p >
20+ In the following PRE element, each 24 pixel line is simulated by two lines, the second
21+ beginning with the appropriate number. The text that is to the left of the line numbers
22+ lies outside the initial containing block. The lines, as they appear in the image,
23+ contain approximately:
24+ </ p >
25+ < pre >
26+ 1 Beginning of body contents. [@]Start
27+
28+ 2 of outer contents. End of outer
29+
30+ 3 contents. End of body contents.
31+
32+ 4
33+
34+ Inner 5
35+
36+ Conte 6 nts
37+
38+ 7
39+
40+ 8
41+ </ pre >
42+ < p >
43+ The default text color is black. "Start of outer contents" is red. The "nts" in "Inner
44+ contents" is blue. "End of outer contents" is red.
45+ </ p >
46+ < p > < a href ="../Overview.html#img-flow-static "> Return to image.</ a > </ p >
47+ </ body >
48+ </ html >
You can’t perform that action at this time.
0 commit comments