| layer at (0,0) size 800x4470 |
| RenderView at (0,0) size 800x600 |
| layer at (0,0) size 800x4470 |
| RenderBlock {HTML} at (0,0) size 800x4470 |
| RenderBody {BODY} at (8,8) size 784x4454 [bgcolor=#CCCCCC] |
| RenderBlock {P} at (0,0) size 784x20 |
| RenderText {#text} at (0,0) size 363x19 |
| text run at (0,0) width 363: "The style declarations which apply to the text below are:" |
| RenderBlock {PRE} at (0,36) size 784x252 |
| RenderText {#text} at (0,0) size 500x252 |
| text run at (0,0) width 157: "P {font-size: 12pt;}" |
| text run at (0,14) width 211: ".one {vertical-align: sub;}" |
| text run at (0,28) width 227: ".two {vertical-align: super;}" |
| text run at (0,42) width 359: ".three {vertical-align: top; font-size: 12pt;}" |
| text run at (0,56) width 391: ".four {vertical-align: text-top; font-size: 12pt;}" |
| text run at (0,70) width 375: ".five {vertical-align: middle; font-size: 12pt;}" |
| text run at (0,84) width 367: ".six {vertical-align: bottom; font-size: 12pt;}" |
| text run at (0,98) width 422: ".seven {vertical-align: text-bottom; font-size: 12pt;}" |
| text run at (0,112) width 398: ".eight {vertical-align: baseline; font-size: 12pt;}" |
| text run at (0,126) width 500: ".nine {vertical-align: 50%; font-size: 12px; line-height: 16px;}" |
| text run at (0,140) width 0: " " |
| text run at (0,154) width 219: "P.example {font-size: 14pt;}" |
| text run at (0,168) width 172: "BIG {font-size: 16pt;}" |
| text run at (0,182) width 188: "SMALL {font-size: 12pt;}" |
| text run at (0,196) width 297: ".ttopalign {vertical-align: text-top;}" |
| text run at (0,210) width 250: ".topalign {vertical-align: top;}" |
| text run at (0,224) width 274: ".midalign {vertical-align: middle;}" |
| text run at (0,238) width 0: " " |
| RenderBlock {HR} at (0,301) size 784x2 [border: (1px inset #000000)] |
| RenderBlock {P} at (0,319) size 784x79 |
| RenderImage {IMG} at (0,0) size 15x50 |
| RenderInline {SPAN} at (0,0) size 129x19 |
| RenderText {#text} at (15,39) size 129x19 |
| text run at (15,39) width 129: "The first four words" |
| RenderText {#text} at (143,35) size 766x43 |
| text run at (143,35) width 292: " in this sentence should be subscript-aligned. " |
| text run at (434,35) width 332: "The font size of the superscripted text should not be" |
| text run at (0,59) width 262: "different from that of the parent element." |
| RenderBlock {P} at (0,414) size 784x75 |
| RenderImage {IMG} at (0,0) size 15x50 |
| RenderInline {SPAN} at (0,0) size 129x19 |
| RenderText {#text} at (15,29) size 129x19 |
| text run at (15,29) width 129: "The first four words" |
| RenderText {#text} at (143,35) size 766x39 |
| text run at (143,35) width 304: " in this sentence should be superscript-aligned. " |
| text run at (446,35) width 320: "The font size of the subscripted text should not be" |
| text run at (0,55) width 262: "different from that of the parent element." |
| RenderBlock {P} at (0,505) size 784x75 |
| RenderImage {IMG} at (0,0) size 15x50 |
| RenderInline {SPAN} at (0,0) size 129x19 |
| RenderText {#text} at (15,0) size 129x19 |
| text run at (15,0) width 129: "The first four words" |
| RenderText {#text} at (143,35) size 783x39 |
| text run at (143,35) width 640: " in this sentence should be top-aligned, which will align their tops with the top of the tallest element" |
| text run at (0,55) width 274: "in the line (probably the orange rectangle)." |
| RenderBlock {P} at (0,596) size 784x134 |
| RenderImage {IMG} at (0,0) size 15x50 |
| RenderText {#text} at (15,35) size 4x19 |
| text run at (15,35) width 4: " " |
| RenderInline {SPAN} at (0,0) size 755x112 |
| RenderText {#text} at (0,0) size 0x0 |
| RenderInline {SPAN} at (0,0) size 129x19 |
| RenderText {#text} at (19,21) size 129x19 |
| text run at (19,21) width 129: "The first four words" |
| RenderText {#text} at (147,21) size 755x112 |
| text run at (147,21) width 558: " in this sentence should be text-top-aligned," |
| text run at (0,59) width 755: "which should align their tops with the top of the tallest text" |
| text run at (0,97) width 136: "in the line." |
| RenderText {#text} at (0,0) size 0x0 |
| RenderBlock {P} at (0,746) size 784x70 |
| RenderImage {IMG} at (0,0) size 15x50 |
| RenderText {#text} at (15,14) size 755x55 |
| text run at (15,14) width 740: " The image at the beginning of this sentence should be middle-aligned, which should align its middle with the point" |
| text run at (0,50) width 318: "defined as the text baseline plus half the x-height." |
| RenderBlock {P} at (0,832) size 784x126 |
| RenderImage {IMG} at (0,0) size 15x50 |
| RenderText {#text} at (15,15) size 4x19 |
| text run at (15,15) width 4: " " |
| RenderInline {SPAN} at (0,0) size 733x124 |
| RenderText {#text} at (0,0) size 0x0 |
| RenderInline {SPAN} at (0,0) size 129x19 |
| RenderText {#text} at (19,30) size 129x19 |
| text run at (19,30) width 129: "The first four words" |
| RenderText {#text} at (147,1) size 733x124 |
| text run at (147,1) width 547: " in this sentence should be 12pt in size and" |
| text run at (0,51) width 733: "bottom-aligned, which should align their bottom with the" |
| text run at (0,89) width 518: "bottom of the lowest element in the line." |
| RenderText {#text} at (0,0) size 0x0 |
| RenderBlock {P} at (0,974) size 784x164 |
| RenderImage {IMG} at (0,0) size 15x50 |
| RenderText {#text} at (15,15) size 4x19 |
| text run at (15,15) width 4: " " |
| RenderInline {SPAN} at (0,0) size 752x162 |
| RenderText {#text} at (0,0) size 0x0 |
| RenderInline {SPAN} at (0,0) size 298x19 |
| RenderText {#text} at (19,17) size 298x19 |
| text run at (19,17) width 298: "The first eight words (\"eight\" has a descender)" |
| RenderText {#text} at (316,1) size 752x162 |
| text run at (316,1) width 436: " in this sentence should be 12pt in" |
| text run at (0,51) width 693: "size and text-bottom-aligned, which should align their" |
| text run at (0,89) width 671: "bottom with the bottom of the lowest text (including" |
| text run at (0,127) width 295: "descenders) in the line." |
| RenderText {#text} at (0,0) size 0x0 |
| RenderBlock {P} at (0,1154) size 784x134 |
| RenderImage {IMG} at (0,0) size 15x50 |
| RenderText {#text} at (15,35) size 4x19 |
| text run at (15,35) width 4: " " |
| RenderInline {SPAN} at (0,0) size 761x112 |
| RenderText {#text} at (0,0) size 0x0 |
| RenderInline {SPAN} at (0,0) size 129x19 |
| RenderText {#text} at (19,35) size 129x19 |
| text run at (19,35) width 129: "The first four words" |
| RenderText {#text} at (147,21) size 761x112 |
| text run at (147,21) width 547: " in this sentence should be 12pt in size and" |
| text run at (0,59) width 761: "baseline-aligned, which should align their baseline with the" |
| text run at (0,97) width 523: "baseline of the rest of the text in the line." |
| RenderText {#text} at (0,0) size 0x0 |
| RenderBlock {P} at (0,1304) size 784x75 |
| RenderImage {IMG} at (0,0) size 15x50 |
| RenderInline {SPAN} at (0,0) size 97x14 |
| RenderText {#text} at (15,31) size 97x14 |
| text run at (15,31) width 97: "The first four words" |
| RenderText {#text} at (111,35) size 764x39 |
| text run at (111,35) width 653: " in this sentence should have a font-size of 12px and a line-height of 16px; they are also 50%-aligned," |
| text run at (0,55) width 385: "which should raise them 8px relative to the natural baseline." |
| RenderBlock {P} at (0,1395) size 784x40 |
| RenderText {#text} at (0,0) size 760x39 |
| text run at (0,0) width 760: "In the following paragraph, all images should be aligned with the top of the 14-point text, which is identical to the first" |
| text run at (0,20) width 676: "section of text, whereas any size text should be aligned with the text baseline (which is the default value)." |
| RenderBlock {P} at (0,1453) size 784x326 |
| RenderText {#text} at (0,26) size 120x22 |
| text run at (0,26) width 120: "This paragraph " |
| RenderImage {IMG} at (119,26) size 10x30 |
| RenderText {#text} at (128,26) size 5x22 |
| text run at (128,26) width 5: " " |
| RenderInline {SPAN} at (0,0) size 419x53 |
| RenderText {#text} at (132,1) size 419x53 |
| text run at (132,1) width 419: "contains many images" |
| RenderText {#text} at (550,26) size 6x22 |
| text run at (550,26) width 6: " " |
| RenderImage {IMG} at (555,26) size 16x50 |
| RenderText {#text} at (570,26) size 6x22 |
| text run at (570,26) width 6: " " |
| RenderInline {BIG} at (0,0) size 153x24 |
| RenderText {#text} at (575,24) size 153x24 |
| text run at (575,24) width 153: "of varying heights" |
| RenderText {#text} at (727,26) size 6x22 |
| text run at (727,26) width 6: " " |
| RenderImage {IMG} at (732,26) size 4x10 |
| RenderText {#text} at (735,26) size 6x22 |
| text run at (735,26) width 6: " " |
| RenderInline {SMALL} at (0,0) size 764x116 |
| RenderText {#text} at (740,28) size 764x116 |
| text run at (740,28) width 24: "and" |
| text run at (0,125) width 43: "widths" |
| RenderText {#text} at (42,123) size 6x22 |
| text run at (42,123) width 6: " " |
| RenderImage {IMG} at (47,123) size 7x20 |
| RenderText {#text} at (53,123) size 101x22 |
| text run at (53,123) width 101: " all of which " |
| RenderImage {IMG} at (153,123) size 21x65 |
| RenderText {#text} at (173,123) size 6x22 |
| text run at (173,123) width 6: " " |
| RenderInline {SPAN} at (0,0) size 262x42 |
| RenderText {#text} at (178,107) size 262x42 |
| text run at (178,107) width 262: "should be aligned" |
| RenderText {#text} at (439,123) size 6x22 |
| text run at (439,123) width 6: " " |
| RenderImage {IMG} at (444,123) size 12x35 |
| RenderText {#text} at (455,123) size 122x22 |
| text run at (455,123) width 122: " with the top of " |
| RenderImage {IMG} at (576,123) size 10x30 |
| RenderText {#text} at (585,123) size 5x22 |
| text run at (585,123) width 5: " " |
| RenderInline {SPAN} at (0,0) size 703x144 |
| RenderText {#text} at (589,115) size 21x32 |
| text run at (589,115) width 21: "a " |
| RenderInline {SPAN} at (0,0) size 703x191 |
| RenderText {#text} at (609,77) size 703x191 |
| text run at (609,77) width 94: "14-" |
| text run at (0,189) width 144: "point" |
| RenderText {#text} at (143,227) size 146x32 |
| text run at (143,227) width 146: " text element" |
| RenderText {#text} at (288,235) size 6x22 |
| text run at (288,235) width 6: " " |
| RenderImage {IMG} at (293,235) size 16x50 |
| RenderText {#text} at (308,235) size 6x22 |
| text run at (308,235) width 6: " " |
| RenderInline {SMALL} at (0,0) size 194x19 |
| RenderText {#text} at (313,237) size 194x19 |
| text run at (313,237) width 194: "regardless of the line in which" |
| RenderText {#text} at (506,235) size 6x22 |
| text run at (506,235) width 6: " " |
| RenderImage {IMG} at (511,235) size 6x15 |
| RenderText {#text} at (516,235) size 5x22 |
| text run at (516,235) width 5: " " |
| RenderInline {BIG} at (0,0) size 157x24 |
| RenderText {#text} at (520,233) size 157x24 |
| text run at (520,233) width 157: "the images appear." |
| RenderText {#text} at (676,235) size 6x22 |
| text run at (676,235) width 6: " " |
| RenderImage {IMG} at (681,235) size 28x90 |
| RenderText {#text} at (0,0) size 0x0 |
| RenderBlock {P} at (0,1797) size 784x41 |
| RenderText {#text} at (0,0) size 765x39 |
| text run at (0,0) width 765: "In the following paragraph, all images should be aligned with the middle of the default text, whereas any text should be" |
| text run at (0,20) width 371: "aligned with the text baseline (which is the default value)." |
| RenderBlock {P} at (0,1853) size 784x233 |
| RenderText {#text} at (0,22) size 101x19 |
| text run at (0,22) width 101: "This paragraph " |
| RenderImage {IMG} at (100,18) size 10x30 |
| RenderText {#text} at (109,22) size 5x19 |
| text run at (109,22) width 5: " " |
| RenderInline {SPAN} at (0,0) size 356x45 |
| RenderText {#text} at (113,1) size 356x45 |
| text run at (113,1) width 356: "contains many images" |
| RenderText {#text} at (468,22) size 5x19 |
| text run at (468,22) width 5: " " |
| RenderImage {IMG} at (472,8) size 16x50 |
| RenderText {#text} at (487,22) size 126x19 |
| text run at (487,22) width 126: " of varying heights " |
| RenderImage {IMG} at (612,28) size 4x10 |
| RenderText {#text} at (615,22) size 5x19 |
| text run at (615,22) width 5: " " |
| RenderInline {SMALL} at (0,0) size 71x19 |
| RenderText {#text} at (619,22) size 71x19 |
| text run at (619,22) width 71: "and widths" |
| RenderText {#text} at (689,22) size 5x19 |
| text run at (689,22) width 5: " " |
| RenderImage {IMG} at (693,23) size 7x20 |
| RenderText {#text} at (699,22) size 85x19 |
| text run at (699,22) width 85: " all of which " |
| RenderImage {IMG} at (0,77) size 20x65 |
| RenderText {#text} at (20,98) size 121x19 |
| text run at (20,98) width 121: " should be aligned " |
| RenderImage {IMG} at (140,92) size 12x35 |
| RenderText {#text} at (151,98) size 5x19 |
| text run at (151,98) width 5: " " |
| RenderInline {SPAN} at (0,0) size 237x36 |
| RenderText {#text} at (155,84) size 237x36 |
| text run at (155,84) width 237: "with the middle of" |
| RenderText {#text} at (391,98) size 5x19 |
| text run at (391,98) width 5: " " |
| RenderImage {IMG} at (395,84) size 16x50 |
| RenderText {#text} at (410,98) size 5x19 |
| text run at (410,98) width 5: " " |
| RenderInline {SPAN} at (0,0) size 345x28 |
| RenderText {#text} at (414,91) size 18x28 |
| text run at (414,91) width 18: "a " |
| RenderInline {SPAN} at (0,0) size 204x67 |
| RenderText {#text} at (431,59) size 204x67 |
| text run at (431,59) width 204: "14-point" |
| RenderText {#text} at (634,91) size 125x28 |
| text run at (634,91) width 125: " text element" |
| RenderText {#text} at (758,98) size 5x19 |
| text run at (758,98) width 5: " " |
| RenderImage {IMG} at (762,84) size 16x50 |
| RenderText {#text} at (0,0) size 0x0 |
| RenderInline {SMALL} at (0,0) size 194x19 |
| RenderText {#text} at (0,176) size 194x19 |
| text run at (0,176) width 194: "regardless of the line in which" |
| RenderText {#text} at (193,176) size 5x19 |
| text run at (193,176) width 5: " " |
| RenderImage {IMG} at (197,180) size 6x15 |
| RenderText {#text} at (202,176) size 5x19 |
| text run at (202,176) width 5: " " |
| RenderInline {BIG} at (0,0) size 156x24 |
| RenderText {#text} at (206,172) size 156x24 |
| text run at (206,172) width 156: "the images appear." |
| RenderText {#text} at (361,176) size 5x19 |
| text run at (361,176) width 5: " " |
| RenderImage {IMG} at (365,142) size 28x90 |
| RenderText {#text} at (0,0) size 0x0 |
| RenderBlock {P} at (0,2101) size 784x41 |
| RenderText {#text} at (0,0) size 751x39 |
| text run at (0,0) width 751: "In the following paragraph, all elements should be aligned with the top of the tallest element on the line, whether that" |
| text run at (0,20) width 178: "element is an image or not. " |
| text run at (177,20) width 563: "Each fragment of text has been SPANned appropriately in order to cause this to happen." |
| RenderBlock {P} at (0,2157) size 784x203 |
| RenderInline {SPAN} at (0,0) size 97x19 |
| RenderText {#text} at (0,0) size 97x19 |
| text run at (0,0) width 97: "This paragraph" |
| RenderText {#text} at (96,0) size 5x19 |
| text run at (96,0) width 5: " " |
| RenderImage {IMG} at (100,0) size 4x10 |
| RenderText {#text} at (103,0) size 5x19 |
| text run at (103,0) width 5: " " |
| RenderInline {SPAN} at (0,0) size 356x45 |
| RenderText {#text} at (107,1) size 356x45 |
| text run at (107,1) width 356: "contains many images" |
| RenderText {#text} at (462,0) size 5x19 |
| text run at (462,0) width 5: " " |
| RenderImage {IMG} at (466,0) size 4x10 |
| RenderText {#text} at (469,0) size 5x19 |
| text run at (469,0) width 5: " " |
| RenderInline {SPAN} at (0,0) size 90x19 |
| RenderText {#text} at (473,0) size 90x19 |
| text run at (473,0) width 90: "and some text" |
| RenderText {#text} at (562,0) size 5x19 |
| text run at (562,0) width 5: " " |
| RenderImage {IMG} at (566,0) size 4x10 |
| RenderText {#text} at (569,0) size 5x19 |
| text run at (569,0) width 5: " " |
| RenderInline {SPAN} at (0,0) size 118x19 |
| RenderText {#text} at (573,0) size 118x19 |
| text run at (573,0) width 118: "of varying heights" |
| RenderText {#text} at (690,0) size 5x19 |
| text run at (690,0) width 5: " " |
| RenderImage {IMG} at (694,0) size 4x10 |
| RenderText {#text} at (697,0) size 5x19 |
| text run at (697,0) width 5: " " |
| RenderInline {BIG} at (0,0) size 732x71 |
| RenderText {#text} at (701,0) size 732x71 |
| text run at (701,0) width 31: "and" |
| text run at (0,47) width 57: "widths" |
| RenderText {#text} at (56,47) size 5x19 |
| text run at (56,47) width 5: " " |
| RenderImage {IMG} at (60,47) size 6x20 |
| RenderText {#text} at (66,47) size 5x19 |
| text run at (66,47) width 5: " " |
| RenderInline {SPAN} at (0,0) size 77x19 |
| RenderText {#text} at (70,47) size 77x19 |
| text run at (70,47) width 77: "all of which" |
| RenderText {#text} at (146,47) size 5x19 |
| text run at (146,47) width 5: " " |
| RenderImage {IMG} at (150,47) size 21x65 |
| RenderText {#text} at (170,47) size 5x19 |
| text run at (170,47) width 5: " " |
| RenderInline {SPAN} at (0,0) size 114x19 |
| RenderText {#text} at (174,47) size 114x19 |
| text run at (174,47) width 114: "should be aligned" |
| RenderText {#text} at (287,47) size 5x19 |
| text run at (287,47) width 5: " " |
| RenderImage {IMG} at (291,47) size 12x35 |
| RenderText {#text} at (302,47) size 5x19 |
| text run at (302,47) width 5: " " |
| RenderInline {SPAN} at (0,0) size 188x36 |
| RenderText {#text} at (306,48) size 188x36 |
| text run at (306,48) width 188: "with the top of" |
| RenderText {#text} at (493,47) size 5x19 |
| text run at (493,47) width 5: " " |
| RenderImage {IMG} at (497,47) size 16x50 |
| RenderText {#text} at (512,47) size 5x19 |
| text run at (512,47) width 5: " " |
| RenderInline {SPAN} at (0,0) size 134x19 |
| RenderText {#text} at (516,47) size 134x19 |
| text run at (516,47) width 134: "the tallest element in" |
| RenderText {#text} at (649,47) size 5x19 |
| text run at (649,47) width 5: " " |
| RenderImage {IMG} at (653,47) size 6x15 |
| RenderText {#text} at (658,47) size 5x19 |
| text run at (658,47) width 5: " " |
| RenderInline {BIG} at (0,0) size 751x89 |
| RenderText {#text} at (662,47) size 751x89 |
| text run at (662,47) width 89: "whichever" |
| text run at (0,112) width 208: "line the elements appear." |
| RenderText {#text} at (207,112) size 5x19 |
| text run at (207,112) width 5: " " |
| RenderImage {IMG} at (211,112) size 28x90 |
| RenderText {#text} at (0,0) size 0x0 |
| RenderTable {TABLE} at (0,2375) size 784x2079 [border: (1px outset #808080)] |
| RenderTableSection {TBODY} at (1,1) size 782x2077 |
| RenderTableRow {TR} at (0,0) size 782x28 |
| RenderTableCell {TD} at (0,0) size 782x28 [bgcolor=#C0C0C0] [border: (1px inset #808080)] [r=0 c=0 rs=1 cs=2] |
| RenderInline {STRONG} at (0,0) size 161x19 |
| RenderText {#text} at (4,4) size 161x19 |
| text run at (4,4) width 161: "TABLE Testing Section" |
| RenderTableRow {TR} at (0,28) size 782x2049 |
| RenderTableCell {TD} at (0,1038) size 12x29 [bgcolor=#C0C0C0] [border: (1px inset #808080)] [r=1 c=0 rs=1 cs=1] |
| RenderText {#text} at (4,3) size 4x20 |
| text run at (4,4) width 4: " " |
| RenderTableCell {TD} at (12,28) size 770x2049 [border: (1px inset #808080)] [r=1 c=1 rs=1 cs=1] |
| RenderBlock {P} at (4,4) size 762x79 |
| RenderImage {IMG} at (0,0) size 15x50 |
| RenderInline {SPAN} at (0,0) size 129x19 |
| RenderText {#text} at (15,39) size 129x19 |
| text run at (15,39) width 129: "The first four words" |
| RenderText {#text} at (143,35) size 747x43 |
| text run at (143,35) width 292: " in this sentence should be subscript-aligned. " |
| text run at (434,35) width 313: "The font size of the superscripted text should not" |
| text run at (0,59) width 281: "be different from that of the parent element." |
| RenderBlock {P} at (4,99) size 762x75 |
| RenderImage {IMG} at (0,0) size 15x50 |
| RenderInline {SPAN} at (0,0) size 129x19 |
| RenderText {#text} at (15,29) size 129x19 |
| text run at (15,29) width 129: "The first four words" |
| RenderText {#text} at (143,35) size 747x39 |
| text run at (143,35) width 304: " in this sentence should be superscript-aligned. " |
| text run at (446,35) width 301: "The font size of the subscripted text should not" |
| text run at (0,55) width 281: "be different from that of the parent element." |
| RenderBlock {P} at (4,190) size 762x75 |
| RenderImage {IMG} at (0,0) size 15x50 |
| RenderInline {SPAN} at (0,0) size 129x19 |
| RenderText {#text} at (15,0) size 129x19 |
| text run at (15,0) width 129: "The first four words" |
| RenderText {#text} at (143,35) size 729x39 |
| text run at (143,35) width 586: " in this sentence should be top-aligned, which will align their tops with the top of the tallest" |
| text run at (0,55) width 328: "element in the line (probably the orange rectangle)." |
| RenderBlock {P} at (4,281) size 762x134 |
| RenderImage {IMG} at (0,0) size 15x50 |
| RenderText {#text} at (15,35) size 4x19 |
| text run at (15,35) width 4: " " |
| RenderInline {SPAN} at (0,0) size 755x112 |
| RenderText {#text} at (0,0) size 0x0 |
| RenderInline {SPAN} at (0,0) size 129x19 |
| RenderText {#text} at (19,21) size 129x19 |
| text run at (19,21) width 129: "The first four words" |
| RenderText {#text} at (147,21) size 755x112 |
| text run at (147,21) width 558: " in this sentence should be text-top-aligned," |
| text run at (0,59) width 755: "which should align their tops with the top of the tallest text" |
| text run at (0,97) width 136: "in the line." |
| RenderText {#text} at (0,0) size 0x0 |
| RenderBlock {P} at (4,431) size 762x70 |
| RenderImage {IMG} at (0,0) size 15x50 |
| RenderText {#text} at (15,14) size 755x55 |
| text run at (15,14) width 740: " The image at the beginning of this sentence should be middle-aligned, which should align its middle with the point" |
| text run at (0,50) width 318: "defined as the text baseline plus half the x-height." |
| RenderBlock {P} at (4,517) size 762x126 |
| RenderImage {IMG} at (0,0) size 15x50 |
| RenderText {#text} at (15,15) size 4x19 |
| text run at (15,15) width 4: " " |
| RenderInline {SPAN} at (0,0) size 733x124 |
| RenderText {#text} at (0,0) size 0x0 |
| RenderInline {SPAN} at (0,0) size 129x19 |
| RenderText {#text} at (19,30) size 129x19 |
| text run at (19,30) width 129: "The first four words" |
| RenderText {#text} at (147,1) size 733x124 |
| text run at (147,1) width 547: " in this sentence should be 12pt in size and" |
| text run at (0,51) width 733: "bottom-aligned, which should align their bottom with the" |
| text run at (0,89) width 518: "bottom of the lowest element in the line." |
| RenderText {#text} at (0,0) size 0x0 |
| RenderBlock {P} at (4,659) size 762x164 |
| RenderImage {IMG} at (0,0) size 15x50 |
| RenderText {#text} at (15,15) size 4x19 |
| text run at (15,15) width 4: " " |
| RenderInline {SPAN} at (0,0) size 752x162 |
| RenderText {#text} at (0,0) size 0x0 |
| RenderInline {SPAN} at (0,0) size 298x19 |
| RenderText {#text} at (19,17) size 298x19 |
| text run at (19,17) width 298: "The first eight words (\"eight\" has a descender)" |
| RenderText {#text} at (316,1) size 752x162 |
| text run at (316,1) width 436: " in this sentence should be 12pt in" |
| text run at (0,51) width 693: "size and text-bottom-aligned, which should align their" |
| text run at (0,89) width 671: "bottom with the bottom of the lowest text (including" |
| text run at (0,127) width 295: "descenders) in the line." |
| RenderText {#text} at (0,0) size 0x0 |
| RenderBlock {P} at (4,839) size 762x134 |
| RenderImage {IMG} at (0,0) size 15x50 |
| RenderText {#text} at (15,35) size 4x19 |
| text run at (15,35) width 4: " " |
| RenderInline {SPAN} at (0,0) size 761x112 |
| RenderText {#text} at (0,0) size 0x0 |
| RenderInline {SPAN} at (0,0) size 129x19 |
| RenderText {#text} at (19,35) size 129x19 |
| text run at (19,35) width 129: "The first four words" |
| RenderText {#text} at (147,21) size 761x112 |
| text run at (147,21) width 547: " in this sentence should be 12pt in size and" |
| text run at (0,59) width 761: "baseline-aligned, which should align their baseline with the" |
| text run at (0,97) width 523: "baseline of the rest of the text in the line." |
| RenderText {#text} at (0,0) size 0x0 |
| RenderBlock {P} at (4,989) size 762x75 |
| RenderImage {IMG} at (0,0) size 15x50 |
| RenderInline {SPAN} at (0,0) size 97x14 |
| RenderText {#text} at (15,31) size 97x14 |
| text run at (15,31) width 97: "The first four words" |
| RenderText {#text} at (111,35) size 713x39 |
| text run at (111,35) width 602: " in this sentence should have a font-size of 12px and a line-height of 16px; they are also 50%-" |
| text run at (0,55) width 440: "aligned, which should raise them 8px relative to the natural baseline." |
| RenderBlock {P} at (4,1080) size 762x40 |
| RenderText {#text} at (0,0) size 760x39 |
| text run at (0,0) width 760: "In the following paragraph, all images should be aligned with the top of the 14-point text, which is identical to the first" |
| text run at (0,20) width 676: "section of text, whereas any size text should be aligned with the text baseline (which is the default value)." |
| RenderBlock {P} at (4,1138) size 762x326 |
| RenderText {#text} at (0,26) size 120x22 |
| text run at (0,26) width 120: "This paragraph " |
| RenderImage {IMG} at (119,26) size 10x30 |
| RenderText {#text} at (128,26) size 5x22 |
| text run at (128,26) width 5: " " |
| RenderInline {SPAN} at (0,0) size 419x53 |
| RenderText {#text} at (132,1) size 419x53 |
| text run at (132,1) width 419: "contains many images" |
| RenderText {#text} at (550,26) size 6x22 |
| text run at (550,26) width 6: " " |
| RenderImage {IMG} at (555,26) size 16x50 |
| RenderText {#text} at (570,26) size 6x22 |
| text run at (570,26) width 6: " " |
| RenderInline {BIG} at (0,0) size 153x24 |
| RenderText {#text} at (575,24) size 153x24 |
| text run at (575,24) width 153: "of varying heights" |
| RenderText {#text} at (727,26) size 6x22 |
| text run at (727,26) width 6: " " |
| RenderImage {IMG} at (732,26) size 4x10 |
| RenderText {#text} at (0,0) size 0x0 |
| RenderInline {SMALL} at (0,0) size 70x19 |
| RenderText {#text} at (0,125) size 70x19 |
| text run at (0,125) width 70: "and widths" |
| RenderText {#text} at (69,123) size 6x22 |
| text run at (69,123) width 6: " " |
| RenderImage {IMG} at (74,123) size 7x20 |
| RenderText {#text} at (80,123) size 101x22 |
| text run at (80,123) width 101: " all of which " |
| RenderImage {IMG} at (180,123) size 21x65 |
| RenderText {#text} at (200,123) size 6x22 |
| text run at (200,123) width 6: " " |
| RenderInline {SPAN} at (0,0) size 262x42 |
| RenderText {#text} at (205,107) size 262x42 |
| text run at (205,107) width 262: "should be aligned" |
| RenderText {#text} at (466,123) size 6x22 |
| text run at (466,123) width 6: " " |
| RenderImage {IMG} at (471,123) size 12x35 |
| RenderText {#text} at (482,123) size 122x22 |
| text run at (482,123) width 122: " with the top of " |
| RenderImage {IMG} at (603,123) size 10x30 |
| RenderText {#text} at (612,123) size 5x22 |
| text run at (612,123) width 5: " " |
| RenderInline {SPAN} at (0,0) size 730x144 |
| RenderText {#text} at (616,115) size 21x32 |
| text run at (616,115) width 21: "a " |
| RenderInline {SPAN} at (0,0) size 730x191 |
| RenderText {#text} at (636,77) size 730x191 |
| text run at (636,77) width 94: "14-" |
| text run at (0,189) width 144: "point" |
| RenderText {#text} at (143,227) size 146x32 |
| text run at (143,227) width 146: " text element" |
| RenderText {#text} at (288,235) size 6x22 |
| text run at (288,235) width 6: " " |
| RenderImage {IMG} at (293,235) size 16x50 |
| RenderText {#text} at (308,235) size 6x22 |
| text run at (308,235) width 6: " " |
| RenderInline {SMALL} at (0,0) size 194x19 |
| RenderText {#text} at (313,237) size 194x19 |
| text run at (313,237) width 194: "regardless of the line in which" |
| RenderText {#text} at (506,235) size 6x22 |
| text run at (506,235) width 6: " " |
| RenderImage {IMG} at (511,235) size 6x15 |
| RenderText {#text} at (516,235) size 5x22 |
| text run at (516,235) width 5: " " |
| RenderInline {BIG} at (0,0) size 157x24 |
| RenderText {#text} at (520,233) size 157x24 |
| text run at (520,233) width 157: "the images appear." |
| RenderText {#text} at (676,235) size 6x22 |
| text run at (676,235) width 6: " " |
| RenderImage {IMG} at (681,235) size 28x90 |
| RenderText {#text} at (0,0) size 0x0 |
| RenderBlock {P} at (4,1482) size 762x41 |
| RenderText {#text} at (0,0) size 746x39 |
| text run at (0,0) width 746: "In the following paragraph, all images should be aligned with the middle of the default text, whereas any text should" |
| text run at (0,20) width 390: "be aligned with the text baseline (which is the default value)." |
| RenderBlock {P} at (4,1538) size 762x233 |
| RenderText {#text} at (0,22) size 101x19 |
| text run at (0,22) width 101: "This paragraph " |
| RenderImage {IMG} at (100,18) size 10x30 |
| RenderText {#text} at (109,22) size 5x19 |
| text run at (109,22) width 5: " " |
| RenderInline {SPAN} at (0,0) size 356x45 |
| RenderText {#text} at (113,1) size 356x45 |
| text run at (113,1) width 356: "contains many images" |
| RenderText {#text} at (468,22) size 5x19 |
| text run at (468,22) width 5: " " |
| RenderImage {IMG} at (472,8) size 16x50 |
| RenderText {#text} at (487,22) size 126x19 |
| text run at (487,22) width 126: " of varying heights " |
| RenderImage {IMG} at (612,28) size 4x10 |
| RenderText {#text} at (615,22) size 5x19 |
| text run at (615,22) width 5: " " |
| RenderInline {SMALL} at (0,0) size 71x19 |
| RenderText {#text} at (619,22) size 71x19 |
| text run at (619,22) width 71: "and widths" |
| RenderText {#text} at (689,22) size 5x19 |
| text run at (689,22) width 5: " " |
| RenderImage {IMG} at (693,23) size 7x20 |
| RenderText {#text} at (699,22) size 737x95 |
| text run at (699,22) width 38: " all of" |
| text run at (0,98) width 44: "which " |
| RenderImage {IMG} at (43,77) size 21x65 |
| RenderText {#text} at (63,98) size 121x19 |
| text run at (63,98) width 121: " should be aligned " |
| RenderImage {IMG} at (183,92) size 12x35 |
| RenderText {#text} at (194,98) size 5x19 |
| text run at (194,98) width 5: " " |
| RenderInline {SPAN} at (0,0) size 237x36 |
| RenderText {#text} at (198,84) size 237x36 |
| text run at (198,84) width 237: "with the middle of" |
| RenderText {#text} at (434,98) size 5x19 |
| text run at (434,98) width 5: " " |
| RenderImage {IMG} at (438,84) size 16x50 |
| RenderText {#text} at (453,98) size 5x19 |
| text run at (453,98) width 5: " " |
| RenderInline {SPAN} at (0,0) size 720x106 |
| RenderText {#text} at (457,91) size 18x28 |
| text run at (457,91) width 18: "a " |
| RenderInline {SPAN} at (0,0) size 204x67 |
| RenderText {#text} at (474,59) size 204x67 |
| text run at (474,59) width 204: "14-point" |
| RenderText {#text} at (677,91) size 720x106 |
| text run at (677,91) width 43: " text" |
| text run at (0,169) width 76: "element" |
| RenderText {#text} at (75,176) size 5x19 |
| text run at (75,176) width 5: " " |
| RenderImage {IMG} at (79,162) size 16x50 |
| RenderText {#text} at (94,176) size 5x19 |
| text run at (94,176) width 5: " " |
| RenderInline {SMALL} at (0,0) size 195x19 |
| RenderText {#text} at (98,176) size 195x19 |
| text run at (98,176) width 195: "regardless of the line in which" |
| RenderText {#text} at (292,176) size 5x19 |
| text run at (292,176) width 5: " " |
| RenderImage {IMG} at (296,180) size 6x15 |
| RenderText {#text} at (301,176) size 5x19 |
| text run at (301,176) width 5: " " |
| RenderInline {BIG} at (0,0) size 156x24 |
| RenderText {#text} at (305,172) size 156x24 |
| text run at (305,172) width 156: "the images appear." |
| RenderText {#text} at (460,176) size 5x19 |
| text run at (460,176) width 5: " " |
| RenderImage {IMG} at (464,142) size 28x90 |
| RenderText {#text} at (0,0) size 0x0 |
| RenderBlock {P} at (4,1786) size 762x41 |
| RenderText {#text} at (0,0) size 751x39 |
| text run at (0,0) width 751: "In the following paragraph, all elements should be aligned with the top of the tallest element on the line, whether that" |
| text run at (0,20) width 178: "element is an image or not. " |
| text run at (177,20) width 563: "Each fragment of text has been SPANned appropriately in order to cause this to happen." |
| RenderBlock {P} at (4,1842) size 762x203 |
| RenderInline {SPAN} at (0,0) size 97x19 |
| RenderText {#text} at (0,0) size 97x19 |
| text run at (0,0) width 97: "This paragraph" |
| RenderText {#text} at (96,0) size 5x19 |
| text run at (96,0) width 5: " " |
| RenderImage {IMG} at (100,0) size 4x10 |
| RenderText {#text} at (103,0) size 5x19 |
| text run at (103,0) width 5: " " |
| RenderInline {SPAN} at (0,0) size 356x45 |
| RenderText {#text} at (107,1) size 356x45 |
| text run at (107,1) width 356: "contains many images" |
| RenderText {#text} at (462,0) size 5x19 |
| text run at (462,0) width 5: " " |
| RenderImage {IMG} at (466,0) size 4x10 |
| RenderText {#text} at (469,0) size 5x19 |
| text run at (469,0) width 5: " " |
| RenderInline {SPAN} at (0,0) size 90x19 |
| RenderText {#text} at (473,0) size 90x19 |
| text run at (473,0) width 90: "and some text" |
| RenderText {#text} at (562,0) size 5x19 |
| text run at (562,0) width 5: " " |
| RenderImage {IMG} at (566,0) size 4x10 |
| RenderText {#text} at (569,0) size 5x19 |
| text run at (569,0) width 5: " " |
| RenderInline {SPAN} at (0,0) size 118x19 |
| RenderText {#text} at (573,0) size 118x19 |
| text run at (573,0) width 118: "of varying heights" |
| RenderText {#text} at (690,0) size 5x19 |
| text run at (690,0) width 5: " " |
| RenderImage {IMG} at (694,0) size 4x10 |
| RenderText {#text} at (697,0) size 5x19 |
| text run at (697,0) width 5: " " |
| RenderInline {BIG} at (0,0) size 732x71 |
| RenderText {#text} at (701,0) size 732x71 |
| text run at (701,0) width 31: "and" |
| text run at (0,47) width 57: "widths" |
| RenderText {#text} at (56,47) size 5x19 |
| text run at (56,47) width 5: " " |
| RenderImage {IMG} at (60,47) size 6x20 |
| RenderText {#text} at (66,47) size 5x19 |
| text run at (66,47) width 5: " " |
| RenderInline {SPAN} at (0,0) size 77x19 |
| RenderText {#text} at (70,47) size 77x19 |
| text run at (70,47) width 77: "all of which" |
| RenderText {#text} at (146,47) size 5x19 |
| text run at (146,47) width 5: " " |
| RenderImage {IMG} at (150,47) size 21x65 |
| RenderText {#text} at (170,47) size 5x19 |
| text run at (170,47) width 5: " " |
| RenderInline {SPAN} at (0,0) size 114x19 |
| RenderText {#text} at (174,47) size 114x19 |
| text run at (174,47) width 114: "should be aligned" |
| RenderText {#text} at (287,47) size 5x19 |
| text run at (287,47) width 5: " " |
| RenderImage {IMG} at (291,47) size 12x35 |
| RenderText {#text} at (302,47) size 5x19 |
| text run at (302,47) width 5: " " |
| RenderInline {SPAN} at (0,0) size 188x36 |
| RenderText {#text} at (306,48) size 188x36 |
| text run at (306,48) width 188: "with the top of" |
| RenderText {#text} at (493,47) size 5x19 |
| text run at (493,47) width 5: " " |
| RenderImage {IMG} at (497,47) size 16x50 |
| RenderText {#text} at (512,47) size 5x19 |
| text run at (512,47) width 5: " " |
| RenderInline {SPAN} at (0,0) size 134x19 |
| RenderText {#text} at (516,47) size 134x19 |
| text run at (516,47) width 134: "the tallest element in" |
| RenderText {#text} at (649,47) size 5x19 |
| text run at (649,47) width 5: " " |
| RenderImage {IMG} at (653,47) size 6x15 |
| RenderText {#text} at (658,47) size 5x19 |
| text run at (658,47) width 5: " " |
| RenderInline {BIG} at (0,0) size 751x89 |
| RenderText {#text} at (662,47) size 751x89 |
| text run at (662,47) width 89: "whichever" |
| text run at (0,112) width 208: "line the elements appear." |
| RenderText {#text} at (207,112) size 5x19 |
| text run at (207,112) width 5: " " |
| RenderImage {IMG} at (211,112) size 28x90 |
| RenderText {#text} at (0,0) size 0x0 |
