| OLD | NEW |
| (Empty) |
| 1 layer at (0,0) size 785x2319 | |
| 2 RenderView at (0,0) size 785x600 | |
| 3 layer at (0,0) size 785x2319 | |
| 4 RenderBlock {HTML} at (0,0) size 785x2319 | |
| 5 RenderBody {BODY} at (8,8) size 769x2303 [bgcolor=#CCCCCC] | |
| 6 RenderBlock {P} at (0,0) size 769x18 | |
| 7 RenderText {#text} at (0,0) size 355x18 | |
| 8 text run at (0,0) width 355: "The style declarations which apply to th
e text below are:" | |
| 9 RenderBlock {PRE} at (0,34) size 769x270 | |
| 10 RenderText {#text} at (0,0) size 536x270 | |
| 11 text run at (0,0) width 344: "P.one {font-size: 14px; line-height: 20p
x;}" | |
| 12 text run at (344,0) width 0: " " | |
| 13 text run at (0,15) width 304: "IMG.onea {vertical-align: text-bottom;" | |
| 14 text run at (304,15) width 0: " " | |
| 15 text run at (0,30) width 272: " width: 200px; height: 200px;}" | |
| 16 text run at (272,30) width 0: " " | |
| 17 text run at (0,45) width 520: "IMG.oneb {vertical-align: text-top; wid
th: 200px; height: 200px;}" | |
| 18 text run at (520,45) width 0: " " | |
| 19 text run at (0,60) width 0: " " | |
| 20 text run at (0,75) width 344: "P.two {font-size: 14px; line-height: 20
px;}" | |
| 21 text run at (344,75) width 0: " " | |
| 22 text run at (0,90) width 536: "IMG.twoa {vertical-align: text-bottom;
width: 100px; height: 100px;" | |
| 23 text run at (536,90) width 0: " " | |
| 24 text run at (0,105) width 312: " padding: 5px; border-style: solid
;" | |
| 25 text run at (312,105) width 0: " " | |
| 26 text run at (0,120) width 312: " border-width: 10px; margin: 15px;
}" | |
| 27 text run at (312,120) width 0: " " | |
| 28 text run at (0,135) width 280: "IMG.twob {vertical-align: text-top;" | |
| 29 text run at (280,135) width 0: " " | |
| 30 text run at (0,150) width 304: " width: 100px; height: 100px;
" | |
| 31 text run at (304,150) width 0: " " | |
| 32 text run at (0,165) width 312: " padding: 5px; border-style: solid
;" | |
| 33 text run at (312,165) width 0: " " | |
| 34 text run at (0,180) width 312: " border-width: 10px; margin: 15px;
}" | |
| 35 text run at (312,180) width 0: " " | |
| 36 text run at (0,195) width 0: " " | |
| 37 text run at (0,210) width 480: "IMG.twoc {vertical-align: middle; widt
h: 50px; height: 50px;" | |
| 38 text run at (480,210) width 0: " " | |
| 39 text run at (0,225) width 312: " padding: 5px; border-style: solid
;" | |
| 40 text run at (312,225) width 0: " " | |
| 41 text run at (0,240) width 320: " border-width: 10px; margin: -10px
;}" | |
| 42 text run at (320,240) width 0: " " | |
| 43 text run at (0,255) width 0: " " | |
| 44 RenderBlock {HR} at (0,317) size 769x2 [border: (1px inset #000000)] | |
| 45 RenderBlock {P} at (0,333) size 769x463 | |
| 46 RenderText {#text} at (0,1) size 767x239 | |
| 47 text run at (0,1) width 420: "This paragraph should have a font size o
f 14px and a line height of 20px. " | |
| 48 text run at (420,1) width 347: "This means that the lines of text with
in it should be separated" | |
| 49 text run at (0,21) width 374: "by six pixels, three of which are part
of the line-box of each line. " | |
| 50 text run at (374,21) width 375: "Any images within the paragraph shoul
d increase the height of the" | |
| 51 text run at (0,223) width 296: "line-box so that they fit within the l
ine box, such as " | |
| 52 RenderImage {IMG} at (296,40) size 200x200 | |
| 53 RenderText {#text} at (496,223) size 28x17 | |
| 54 text run at (496,223) width 28: " and " | |
| 55 RenderImage {IMG} at (524,223) size 200x200 | |
| 56 RenderText {#text} at (724,223) size 757x238 | |
| 57 text run at (724,223) width 8: ". " | |
| 58 text run at (732,223) width 25: "This" | |
| 59 text run at (0,424) width 744: "is additional text to make sure that t
here is enough room left below the image so that this line does not hit the imag
e that is text-top" | |
| 60 text run at (0,444) width 45: "aligned." | |
| 61 RenderBlock {P} at (0,810) size 769x483 | |
| 62 RenderText {#text} at (0,1) size 767x199 | |
| 63 text run at (0,1) width 420: "This paragraph should have a font size o
f 14px and a line height of 20px. " | |
| 64 text run at (420,1) width 347: "This means that the lines of text with
in it should be separated" | |
| 65 text run at (0,21) width 79: "by six pixels. " | |
| 66 text run at (79,21) width 652: "Any images within the paragraph should
increase the height of the line-box so that they fit, including their padding" | |
| 67 text run at (0,183) width 396: "(5px), border (10px) and margins (15px
) within the line box, such as " | |
| 68 RenderImage {IMG} at (411,55) size 130x130 [border: (10px solid #000000)
] | |
| 69 RenderText {#text} at (556,183) size 28x17 | |
| 70 text run at (556,183) width 28: " and " | |
| 71 RenderImage {IMG} at (599,198) size 130x130 [border: (10px solid #000000
)] | |
| 72 RenderText {#text} at (744,183) size 759x257 | |
| 73 text run at (744,183) width 4: "." | |
| 74 text run at (0,344) width 755: "This is additional text to make sure t
hat there is enough room left below the image so that this line does not hit the
image that is text-" | |
| 75 text run at (0,364) width 71: "top aligned. " | |
| 76 text run at (71,364) width 683: "It is the outer edge of the margin th
at should be text-bottom and text-top aligned in this paragraph, so for the firs
t image" | |
| 77 text run at (0,384) width 759: "the bottom border of the image should
begin 15px above the bottom of the text, and for the second image the top border
should begin" | |
| 78 text run at (0,423) width 175: "15px below the top of the text " | |
| 79 RenderImage {IMG} at (165,393) size 80x80 [border: (10px solid #000000)] | |
| 80 RenderText {#text} at (235,423) size 755x58 | |
| 81 text run at (235,423) width 8: ". " | |
| 82 text run at (243,423) width 512: "The last image in this paragraph has
-10px margins set on it, so that should pull the text in" | |
| 83 text run at (0,464) width 443: "toward the image in the vertical direc
tion, and also in the horizontal direction." | |
| 84 RenderTable {TABLE} at (0,1307) size 769x996 [border: (1px outset #808080)
] | |
| 85 RenderTableSection {TBODY} at (1,1) size 767x994 | |
| 86 RenderTableRow {TR} at (0,0) size 767x26 | |
| 87 RenderTableCell {TD} at (0,0) size 767x26 [bgcolor=#C0C0C0] [border:
(1px inset #808080)] [r=0 c=0 rs=1 cs=2] | |
| 88 RenderInline {STRONG} at (0,0) size 163x18 | |
| 89 RenderText {#text} at (4,4) size 163x18 | |
| 90 text run at (4,4) width 163: "TABLE Testing Section" | |
| 91 RenderTableRow {TR} at (0,26) size 767x968 | |
| 92 RenderTableCell {TD} at (0,497) size 12x26 [bgcolor=#C0C0C0] [border
: (1px inset #808080)] [r=1 c=0 rs=1 cs=1] | |
| 93 RenderText {#text} at (4,4) size 4x18 | |
| 94 text run at (4,4) width 4: " " | |
| 95 RenderTableCell {TD} at (12,26) size 755x968 [border: (1px inset #80
8080)] [r=1 c=1 rs=1 cs=1] | |
| 96 RenderBlock {P} at (4,4) size 747x463 | |
| 97 RenderText {#text} at (0,1) size 729x239 | |
| 98 text run at (0,1) width 420: "This paragraph should have a fon
t size of 14px and a line height of 20px. " | |
| 99 text run at (420,1) width 291: "This means that the lines of t
ext within it should be" | |
| 100 text run at (0,21) width 430: "separated by six pixels, three
of which are part of the line-box of each line. " | |
| 101 text run at (430,21) width 299: "Any images within the paragra
ph should increase the" | |
| 102 text run at (0,223) width 372: "height of the line-box so that
they fit within the line box, such as " | |
| 103 RenderImage {IMG} at (372,40) size 200x200 | |
| 104 RenderText {#text} at (572,223) size 28x17 | |
| 105 text run at (572,223) width 28: " and " | |
| 106 RenderImage {IMG} at (0,243) size 200x200 | |
| 107 RenderText {#text} at (200,243) size 741x218 | |
| 108 text run at (200,243) width 8: ". " | |
| 109 text run at (208,243) width 533: "This is additional text to m
ake sure that there is enough room left below the image so that this" | |
| 110 text run at (0,444) width 285: "line does not hit the image th
at is text-top aligned." | |
| 111 RenderBlock {P} at (4,481) size 747x483 | |
| 112 RenderText {#text} at (0,1) size 738x199 | |
| 113 text run at (0,1) width 420: "This paragraph should have a fon
t size of 14px and a line height of 20px. " | |
| 114 text run at (420,1) width 291: "This means that the lines of t
ext within it should be" | |
| 115 text run at (0,21) width 135: "separated by six pixels. " | |
| 116 text run at (135,21) width 603: "Any images within the paragra
ph should increase the height of the line-box so that they fit, including their" | |
| 117 text run at (0,183) width 445: "padding (5px), border (10px) a
nd margins (15px) within the line box, such as " | |
| 118 RenderImage {IMG} at (460,55) size 130x130 [border: (10px solid
#000000)] | |
| 119 RenderText {#text} at (605,183) size 28x17 | |
| 120 text run at (605,183) width 28: " and " | |
| 121 RenderImage {IMG} at (15,218) size 130x130 [border: (10px solid
#000000)] | |
| 122 RenderText {#text} at (160,203) size 736x237 | |
| 123 text run at (160,203) width 8: ". " | |
| 124 text run at (168,203) width 558: "This is additional text to m
ake sure that there is enough room left below the image so that this line" | |
| 125 text run at (0,364) width 264: "does not hit the image that is
text-top aligned. " | |
| 126 text run at (264,364) width 472: "It is the outer edge of the
margin that should be text-bottom and text-top aligned in" | |
| 127 text run at (0,384) width 730: "this paragraph, so for the fir
st image the bottom border of the image should begin 15px above the bottom of th
e text, and for the" | |
| 128 text run at (0,423) width 415: "second image the top border sh
ould begin 15px below the top of the text " | |
| 129 RenderImage {IMG} at (405,393) size 80x80 [border: (10px solid #
000000)] | |
| 130 RenderText {#text} at (475,423) size 724x58 | |
| 131 text run at (475,423) width 8: ". " | |
| 132 text run at (483,423) width 241: "The last image in this parag
raph has -10px" | |
| 133 text run at (0,464) width 714: "margins set on it, so that sho
uld pull the text in toward the image in the vertical direction, and also in the
horizontal direction." | |
| OLD | NEW |