height_of_lines-expected.txt [plain text]
layer at (0,0) size 800x2295
RenderCanvas at (0,0) size 800x600
layer at (0,0) size 800x2295
RenderBlock {HTML} at (0,0) size 800x2295
RenderBody {BODY} at (8,8) size 784x2279 [bgcolor=#CCCCCC]
RenderBlock {P} at (0,0) size 784x18
RenderText {TEXT} at (0,0) size 355x18
text run at (0,0) width 355: "The style declarations which apply to the text below are:"
RenderBlock {PRE} at (0,34) size 784x270
RenderText {TEXT} at (0,0) size 536x255
text run at (0,0) width 160: "P.one {font-size: 14"
text run at (160,0) width 152: "px; line-height: 20"
text run at (312,0) width 32: "px;}"
text run at (0,15) width 304: "IMG.onea {vertical-align: text-bottom;"
text run at (0,30) width 120: " width: 200"
text run at (120,30) width 120: "px; height: 200"
text run at (240,30) width 32: "px;}"
text run at (0,45) width 368: "IMG.oneb {vertical-align: text-top; width: 200"
text run at (368,45) width 120: "px; height: 200"
text run at (488,45) width 32: "px;}"
text run at (0,75) width 160: "P.two {font-size: 14"
text run at (160,75) width 152: "px; line-height: 20"
text run at (312,75) width 32: "px;}"
text run at (0,90) width 392: "IMG.twoa {vertical-align: text-bottom; width: 100"
text run at (392,90) width 120: "px; height: 100"
text run at (512,90) width 24: "px;"
text run at (0,105) width 120: " padding: 5"
text run at (120,105) width 192: "px; border-style: solid;"
text run at (0,120) width 168: " border-width: 10"
text run at (168,120) width 112: "px; margin: 15"
text run at (280,120) width 32: "px;}"
text run at (0,135) width 280: "IMG.twob {vertical-align: text-top;"
text run at (0,150) width 160: " width: 100"
text run at (160,150) width 120: "px; height: 100"
text run at (280,150) width 24: "px;"
text run at (0,165) width 120: " padding: 5"
text run at (120,165) width 192: "px; border-style: solid;"
text run at (0,180) width 168: " border-width: 10"
text run at (168,180) width 112: "px; margin: 15"
text run at (280,180) width 32: "px;}"
text run at (0,210) width 344: "IMG.twoc {vertical-align: middle; width: 50"
text run at (344,210) width 112: "px; height: 50"
text run at (456,210) width 24: "px;"
text run at (0,225) width 120: " padding: 5"
text run at (120,225) width 192: "px; border-style: solid;"
text run at (0,240) width 168: " border-width: 10"
text run at (168,240) width 120: "px; margin: -10"
text run at (288,240) width 32: "px;}"
RenderBlock {HR} at (0,317) size 784x2 [border: (1px inset #000000)]
RenderBlock {P} at (0,333) size 784x442
RenderText {TEXT} at (0,1) size 779x242
text run at (0,1) width 252: "This paragraph should have a font size of 14"
text run at (252,1) width 146: "px and a line height of 20"
text run at (398,1) width 22: "px. "
text run at (420,1) width 347: "This means that the lines of text within it should be separated"
text run at (0,21) width 374: "by six pixels, three of which are part of the line-box of each line. "
text run at (374,21) width 405: "Any images within the paragraph should increase the height of the line-"
text run at (0,223) width 270: "box so that they fit within the line box, such as "
RenderImage {IMG} at (270,40) size 200x200
RenderText {TEXT} at (470,223) size 28x20
text run at (470,223) width 28: " and "
RenderImage {IMG} at (498,222) size 200x200
RenderText {TEXT} at (698,223) size 780x220
text run at (698,223) width 8: ". "
text run at (706,223) width 38: "This is"
text run at (0,423) width 780: "additional text to make sure that there is enough room left below the image so that this line does not hit the image that is text-top aligned."
RenderBlock {P} at (0,789) size 784x482
RenderText {TEXT} at (0,1) size 770x202
text run at (0,1) width 252: "This paragraph should have a font size of 14"
text run at (252,1) width 146: "px and a line height of 20"
text run at (398,1) width 22: "px. "
text run at (420,1) width 347: "This means that the lines of text within it should be separated"
text run at (0,21) width 79: "by six pixels. "
text run at (79,21) width 668: "Any images within the paragraph should increase the height of the line-box so that they fit, including their padding (5"
text run at (747,21) width 23: "px),"
text run at (0,183) width 60: "border (10"
text run at (60,183) width 115: "px) and margins (15"
text run at (175,183) width 182: "px) within the line box, such as "
RenderImage {IMG} at (372,55) size 130x130 [border: (10px solid #000000)]
RenderText {TEXT} at (517,183) size 28x20
text run at (517,183) width 28: " and "
RenderImage {IMG} at (560,197) size 130x130 [border: (10px solid #000000)]
RenderText {TEXT} at (705,183) size 780x259
text run at (705,183) width 8: ". "
text run at (713,183) width 38: "This is"
text run at (0,343) width 780: "additional text to make sure that there is enough room left below the image so that this line does not hit the image that is text-top aligned."
text run at (0,363) width 748: "It is the outer edge of the margin that should be text-bottom and text-top aligned in this paragraph, so for the first image the bottom"
text run at (0,383) width 206: "border of the image should begin 15"
text run at (206,383) width 506: "px above the bottom of the text, and for the second image the top border should begin 15"
text run at (712,383) width 52: "px below"
text run at (0,422) width 105: "the top of the text "
RenderImage {IMG} at (95,392) size 80x80 [border: (10px solid #000000)]
RenderText {TEXT} at (165,422) size 749x61
text run at (165,422) width 8: ". "
text run at (173,422) width 227: "The last image in this paragraph has -10"
text run at (400,422) width 349: "px margins set on it, so that should pull the text in toward the"
text run at (0,463) width 379: "image in the vertical direction, and also in the horizontal direction."
RenderTable {TABLE} at (0,1285) size 784x994 [border: (1px outset #808080)]
RenderTableSection {TBODY} at (1,1) size 0x992
RenderTableRow {TR} at (0,0) size 0x0
RenderTableCell {TD} at (0,0) size 782x26 [bgcolor=#C0C0C0] [border: (1px inset #808080)] [r=0 c=0 rs=1 cs=2]
RenderInline {STRONG} at (0,0) size 163x18
RenderText {TEXT} at (4,4) size 163x18
text run at (4,4) width 163: "TABLE Testing Section"
RenderTableRow {TR} at (0,0) size 0x0
RenderTableCell {TD} at (0,496) size 12x26 [bgcolor=#C0C0C0] [border: (1px inset #808080)] [r=1 c=0 rs=1 cs=1]
RenderText {TEXT} at (4,4) size 4x18
text run at (4,4) width 4: " "
RenderTableCell {TD} at (12,26) size 770x966 [border: (1px inset #808080)] [r=1 c=1 rs=1 cs=1]
RenderBlock {P} at (4,4) size 762x462
RenderText {TEXT} at (0,1) size 729x242
text run at (0,1) width 252: "This paragraph should have a font size of 14"
text run at (252,1) width 146: "px and a line height of 20"
text run at (398,1) width 22: "px. "
text run at (420,1) width 291: "This means that the lines of text within it should be"
text run at (0,21) width 430: "separated by six pixels, three of which are part of the line-box of each line. "
text run at (430,21) width 299: "Any images within the paragraph should increase the"
text run at (0,223) width 372: "height of the line-box so that they fit within the line box, such as "
RenderImage {IMG} at (372,40) size 200x200
RenderText {TEXT} at (572,223) size 28x20
text run at (572,223) width 28: " and "
RenderImage {IMG} at (0,242) size 200x200
RenderText {TEXT} at (200,243) size 741x220
text run at (200,243) width 8: ". "
text run at (208,243) width 533: "This is additional text to make sure that there is enough room left below the image so that this"
text run at (0,443) width 285: "line does not hit the image that is text-top aligned."
RenderBlock {P} at (4,480) size 762x482
RenderText {TEXT} at (0,1) size 738x202
text run at (0,1) width 252: "This paragraph should have a font size of 14"
text run at (252,1) width 146: "px and a line height of 20"
text run at (398,1) width 22: "px. "
text run at (420,1) width 291: "This means that the lines of text within it should be"
text run at (0,21) width 135: "separated by six pixels. "
text run at (135,21) width 603: "Any images within the paragraph should increase the height of the line-box so that they fit, including their"
text run at (0,183) width 61: "padding (5"
text run at (61,183) width 87: "px), border (10"
text run at (148,183) width 115: "px) and margins (15"
text run at (263,183) width 182: "px) within the line box, such as "
RenderImage {IMG} at (460,55) size 130x130 [border: (10px solid #000000)]
RenderText {TEXT} at (605,183) size 28x20
text run at (605,183) width 28: " and "
RenderImage {IMG} at (15,217) size 130x130 [border: (10px solid #000000)]
RenderText {TEXT} at (160,203) size 755x239
text run at (160,203) width 8: ". "
text run at (168,203) width 587: "This is additional text to make sure that there is enough room left below the image so that this line does"
text run at (0,363) width 235: "not hit the image that is text-top aligned. "
text run at (235,363) width 496: "It is the outer edge of the margin that should be text-bottom and text-top aligned in this"
text run at (0,383) width 458: "paragraph, so for the first image the bottom border of the image should begin 15"
text run at (458,383) width 290: "px above the bottom of the text, and for the second"
text run at (0,422) width 212: "image the top border should begin 15"
text run at (212,422) width 161: "px below the top of the text "
RenderImage {IMG} at (363,392) size 80x80 [border: (10px solid #000000)]
RenderText {TEXT} at (433,422) size 750x61
text run at (433,422) width 8: ". "
text run at (441,422) width 227: "The last image in this paragraph has -10"
text run at (668,422) width 82: "px margins set"
text run at (0,463) width 646: "on it, so that should pull the text in toward the image in the vertical direction, and also in the horizontal direction."