628bdaa4d79c49dc1450dbfe589aa03621295524
[WebKit-https.git] / LayoutTests / platform / qt / css1 / box_properties / float_on_text_elements-expected.txt
1 layer at (0,0) size 784x3396
2   RenderView at (0,0) size 784x600
3 layer at (0,0) size 784x3396
4   RenderBlock {HTML} at (0,0) size 784x3396
5     RenderBody {BODY} at (8,8) size 768x3380 [bgcolor=#CCCCCC]
6       RenderBlock (floating) {P} at (0,0) size 384x44 [bgcolor=#FFFF00]
7         RenderText {#text} at (0,0) size 384x44
8           text run at (0,0) width 384: "This paragraph is of class \"one\". It has a width of 50%"
9           text run at (0,22) width 161: "and is floated to the left."
10       RenderBlock {P} at (0,0) size 768x110
11         RenderText {#text} at (384,0) size 768x110
12           text run at (384,0) width 384: "This paragraph should start on the right side of a yellow"
13           text run at (384,22) width 384: "box which contains the previous paragraph. Since the"
14           text run at (0,44) width 768: "text of this element is much longer than the text in the previous element, the text will wrap around the yellow box."
15           text run at (0,66) width 768: "There is no padding, border or margins on this and the previous element, so the text of the two elements should"
16           text run at (0,88) width 182: "be very close to each other."
17       RenderBlock (anonymous) at (0,110) size 768x22
18         RenderBR {BR} at (0,0) size 0x22
19       RenderBlock {HR} at (0,140) size 768x2 [border: (1px inset #000000)]
20       RenderBlock (floating) {P} at (0,150) size 768x88 [bgcolor=#FFFF00]
21         RenderText {#text} at (0,0) size 768x88
22           text run at (0,0) width 768: "This paragraph is of class \"two\". Since the width has been set to 100%, it should automatically be as wide as its"
23           text run at (0,22) width 768: "parent element allows it to be. Therefore, even though the element is floated, there is no room for other content on"
24           text run at (0,44) width 768: "the sides and a orange square image should be seen AFTER the paragraph, not next to it. A yellow background"
25           text run at (0,66) width 392: "has been added to this paragraph for diagnostic purposes."
26       RenderBlock (anonymous) at (0,150) size 768x110
27         RenderImage {IMG} at (0,89) size 15x15
28         RenderText {#text} at (15,88) size 4x22
29           text run at (15,88) width 4: " "
30         RenderBR {BR} at (19,104) size 0x0
31       RenderBlock {HR} at (0,268) size 768x2 [border: (1px inset #000000)]
32       RenderBlock (floating) {P} at (0,278) size 384x132 [bgcolor=#FFFF00]
33         RenderText {#text} at (0,0) size 384x132
34           text run at (0,0) width 384: "This paragraph is floated to the left and the orange"
35           text run at (0,22) width 384: "square image should appear to the right of the"
36           text run at (0,44) width 384: "paragraph. This paragraph has a yellow background"
37           text run at (0,66) width 384: "and no padding, margin or border. The right edge of"
38           text run at (0,88) width 384: "this yellow box should be horizontally aligned with the"
39           text run at (0,110) width 268: "left edge of the yellow box undernearth."
40       RenderBlock (anonymous) at (0,278) size 768x132
41         RenderImage {IMG} at (384,1) size 15x15
42         RenderText {#text} at (399,0) size 4x22
43           text run at (399,0) width 4: " "
44         RenderBR {BR} at (403,16) size 0x0
45       RenderBlock {HR} at (0,418) size 768x2 [border: (1px inset #000000)]
46       RenderBlock (floating) {P} at (384,428) size 384x132 [bgcolor=#FFFF00]
47         RenderText {#text} at (0,0) size 384x132
48           text run at (0,0) width 384: "This paragraph is floated to the right (using a STYLE"
49           text run at (0,22) width 384: "attribute) and the orange square image should appear to"
50           text run at (0,44) width 384: "the left of the paragraph. This paragraph has a yellow"
51           text run at (0,66) width 384: "background and no padding, margin or border. The left"
52           text run at (0,88) width 384: "edge of this yellow box should be horizonally aligned"
53           text run at (0,110) width 293: "with the right edge of the yellow box above."
54       RenderBlock (anonymous) at (0,428) size 768x132
55         RenderImage {IMG} at (0,1) size 15x15
56         RenderText {#text} at (15,0) size 4x22
57           text run at (15,0) width 4: " "
58         RenderBR {BR} at (19,16) size 0x0
59       RenderBlock {HR} at (0,568) size 768x2 [border: (1px inset #000000)]
60       RenderBlock {P} at (0,578) size 768x88
61         RenderBlock (floating) {SPAN} at (0,0) size 48x42 [bgcolor=#C0C0C0]
62           RenderText {#text} at (0,0) size 21x42
63             text run at (0,0) width 21: "T"
64         RenderText {#text} at (48,0) size 768x88
65           text run at (48,0) width 720: "he first letter (a \"T\") of this paragraph should float left and be twice the font-size of the rest of the"
66           text run at (48,22) width 624: "paragraph, as well as bold, with a content width of 1.5em and a background-color of silver. "
67           text run at (672,22) width 95: "The top of the"
68           text run at (0,44) width 768: "big letter \"T\" should be vertically aligned with the top of the first line of this paragraph. This is commonly known"
69           text run at (0,66) width 102: "as \"drop-cap\"."
70       RenderBlock (anonymous) at (0,666) size 768x22
71         RenderBR {BR} at (0,0) size 0x22
72       RenderBlock {HR} at (0,696) size 768x2 [border: (1px inset #000000)]
73       RenderBlock (floating) {P} at (422,716) size 336x258 [bgcolor=#FFFF00] [border: (3px solid #FF0000)]
74         RenderText {#text} at (8,8) size 320x242
75           text run at (8,8) width 320: "This paragraph should be floated to the right,"
76           text run at (8,30) width 320: "sort of like a 'sidebar' in a magazine article. Its"
77           text run at (8,52) width 320: "width is 20em so the box should not be"
78           text run at (8,74) width 320: "reformatted when the size of the viewport is"
79           text run at (8,96) width 320: "changed (e.g. when the window is resized). The"
80           text run at (8,118) width 320: "background color of the element is yellow, and"
81           text run at (8,140) width 320: "there should be a 3px solid red border outside"
82           text run at (8,162) width 320: "a 5px wide padding. Also, the element has a"
83           text run at (8,184) width 320: "10px wide margin around it where the blue"
84           text run at (8,206) width 320: "background of the paragraph in the normal"
85           text run at (8,228) width 180: "flow should shine through."
86       RenderBlock {P} at (0,706) size 768x264 [bgcolor=#66CCFF]
87         RenderText {#text} at (0,0) size 412x264
88           text run at (0,0) width 412: "This paragraph is not floating. If there is enough room, the"
89           text run at (0,22) width 412: "textual content of the paragraph should appear on the left"
90           text run at (0,44) width 283: "side of the yellow \"sidebar\" on the right. "
91           text run at (283,44) width 128: "The content of this"
92           text run at (0,66) width 347: "element should flow around the floated element. "
93           text run at (347,66) width 65: "However,"
94           text run at (0,88) width 412: "the floated element may or may not be obscured by the blue"
95           text run at (0,110) width 412: "background of this element, as the specification does not say"
96           text run at (0,132) width 198: "which is drawn \"on top.\" "
97           text run at (198,132) width 214: "Even if the floated element is"
98           text run at (0,154) width 412: "obscured, it still forces the content of this element to flow"
99           text run at (0,176) width 77: "around it. "
100           text run at (77,176) width 335: "If the floated element is not obscured, then the"
101           text run at (0,198) width 412: "blue rectangle of this paragraph should extend 10px above"
102           text run at (0,220) width 412: "and to the right of the sidebar's red border, due to the"
103           text run at (0,242) width 270: "margin styles set for the floated element."
104       RenderBlock (anonymous) at (0,970) size 768x22
105         RenderBR {BR} at (0,0) size 0x22
106       RenderBlock {HR} at (0,1000) size 768x2 [border: (1px inset #000000)]
107       RenderBlock {DIV} at (0,1010) size 768x30 [bgcolor=#66CCFF] [border: (4px solid #FF0000)]
108         RenderBlock (floating) {DIV} at (424,14) size 330x318 [bgcolor=#FFFF00]
109           RenderBlock {P} at (5,5) size 320x308
110             RenderText {#text} at (0,0) size 320x308
111               text run at (0,0) width 320: "This paragraph is placed inside a DIV element"
112               text run at (0,22) width 320: "which is floated to the right. The width of the"
113               text run at (0,44) width 320: "DIV element is 20em. The background is"
114               text run at (0,66) width 320: "yellow and there is a 5px padding, a 10px"
115               text run at (0,88) width 320: "margin and no border. Since it is floated, the"
116               text run at (0,110) width 320: "yellow box should be rendered on top of the"
117               text run at (0,132) width 320: "background and borders of adjacent non-"
118               text run at (0,154) width 320: "floated elements. To the left of this yellow box"
119               text run at (0,176) width 320: "there should be a short paragraph with a blue"
120               text run at (0,198) width 320: "background and a red border. The yellow box"
121               text run at (0,220) width 320: "should be rendered on top of the bottom red"
122               text run at (0,242) width 320: "border. I.e., the bottom red border will appear"
123               text run at (0,264) width 320: "broken where it's overlaid by the yellow"
124               text run at (0,286) width 66: "rectangle."
125         RenderBlock {P} at (4,4) size 760x22
126           RenderText {#text} at (0,0) size 286x22
127             text run at (0,0) width 286: "See description in the box on the right side"
128       RenderBlock (anonymous) at (0,1040) size 768x312
129         RenderBR {BR} at (0,0) size 0x22
130       RenderBlock {HR} at (0,1360) size 768x2 [border: (1px inset #000000)]
131       RenderBlock (floating) {DIV} at (0,1370) size 192x88 [bgcolor=#66CCFF]
132         RenderBlock {P} at (0,0) size 192x88
133           RenderText {#text} at (0,0) size 192x88
134             text run at (0,0) width 192: "This paragraph is inside a"
135             text run at (0,22) width 192: "DIV which is floated left. Its"
136             text run at (0,44) width 192: "background is blue and the"
137             text run at (0,66) width 93: "width is 25%."
138       RenderBlock (floating) {DIV} at (576,1370) size 192x88 [bgcolor=#FFFF00]
139         RenderBlock {P} at (0,0) size 192x88
140           RenderText {#text} at (0,0) size 192x88
141             text run at (0,0) width 192: "This paragraph is inside a"
142             text run at (0,22) width 192: "DIV which is floated right."
143             text run at (0,44) width 30: "Its "
144             text run at (30,44) width 162: "background is yellow"
145             text run at (0,66) width 148: "and the width is 25%."
146       RenderBlock {P} at (0,1370) size 768x44
147         RenderText {#text} at (192,0) size 384x44
148           text run at (192,0) width 384: "This paragraph should appear between a blue box (on"
149           text run at (192,22) width 55: "the left) "
150           text run at (247,22) width 211: "and a yellow box (on the right)."
151       RenderBlock (anonymous) at (0,1414) size 768x44
152         RenderBR {BR} at (192,0) size 0x22
153       RenderBlock {HR} at (0,1466) size 768x2 [border: (1px inset #000000)]
154       RenderBlock (floating) {DIV} at (0,1476) size 576x154 [bgcolor=#66CCFF]
155         RenderBlock (floating) {DIV} at (422,0) size 144x44 [bgcolor=#FFFF00]
156           RenderBlock {P} at (0,0) size 144x44
157             RenderText {#text} at (0,0) size 144x44
158               text run at (0,0) width 144: "See description in the"
159               text run at (0,22) width 130: "box on the left side."
160         RenderBlock {P} at (0,0) size 576x154
161           RenderText {#text} at (0,0) size 576x154
162             text run at (0,0) width 422: "This paragraph is inside a DIV which is floated left. The"
163             text run at (0,22) width 422: "background of the DIV element is blue and its width is 75%."
164             text run at (0,44) width 35: "This "
165             text run at (35,44) width 401: "text should all be inside the blue rectangle. The blue DIV "
166             text run at (436,44) width 138: "element has another"
167             text run at (0,66) width 271: "DIV element as a child. It has a yellow "
168             text run at (271,66) width 305: "background color and is floated to the right."
169             text run at (0,88) width 89: "Since it is a "
170             text run at (89,88) width 457: "child of the blue DIV, the yellow DIV should appear inside the "
171             text run at (546,88) width 29: "blue"
172             text run at (0,110) width 404: "rectangle. Due to it being floated to the right and having "
173             text run at (404,110) width 172: "a 10px right margin, the"
174             text run at (0,132) width 276: "yellow rectange should have a 10px blue "
175             text run at (276,132) width 149: "stripe on its right side."
176       RenderBlock (anonymous) at (0,1476) size 768x154
177         RenderBR {BR} at (576,0) size 0x22
178       RenderBlock {HR} at (0,1638) size 768x2 [border: (1px inset #000000)]
179       RenderTable {TABLE} at (0,1648) size 768x1732 [border: (1px outset #808080)]
180         RenderTableSection {TBODY} at (1,1) size 766x1730
181           RenderTableRow {TR} at (0,0) size 766x30
182             RenderTableCell {TD} at (0,0) size 766x30 [bgcolor=#C0C0C0] [border: (1px inset #808080)] [r=0 c=0 rs=1 cs=2]
183               RenderInline {STRONG} at (0,0) size 163x22
184                 RenderText {#text} at (4,4) size 163x22
185                   text run at (4,4) width 163: "TABLE Testing Section"
186           RenderTableRow {TR} at (0,30) size 766x1700
187             RenderTableCell {TD} at (0,865) size 12x30 [bgcolor=#C0C0C0] [border: (1px inset #808080)] [r=1 c=0 rs=1 cs=1]
188               RenderText {#text} at (4,4) size 4x22
189                 text run at (4,4) width 4: " "
190             RenderTableCell {TD} at (12,30) size 754x1700 [border: (1px inset #808080)] [r=1 c=1 rs=1 cs=1]
191               RenderBlock (floating) {P} at (4,4) size 373x44 [bgcolor=#FFFF00]
192                 RenderText {#text} at (0,0) size 373x44
193                   text run at (0,0) width 373: "This paragraph is of class \"one\". It has a width of 50%"
194                   text run at (0,22) width 161: "and is floated to the left."
195               RenderBlock {P} at (4,4) size 746x110
196                 RenderText {#text} at (373,0) size 746x110
197                   text run at (373,0) width 373: "This paragraph should start on the right side of a"
198                   text run at (373,22) width 373: "yellow box which contains the previous paragraph."
199                   text run at (0,44) width 746: "Since the text of this element is much longer than the text in the previous element, the text will wrap around"
200                   text run at (0,66) width 746: "the yellow box. There is no padding, border or margins on this and the previous element, so the text of the two"
201                   text run at (0,88) width 293: "elements should be very close to each other."
202               RenderBlock (anonymous) at (4,114) size 746x22
203                 RenderBR {BR} at (0,0) size 0x22
204               RenderBlock {HR} at (4,144) size 746x2 [border: (1px inset #000000)]
205               RenderBlock (floating) {P} at (4,154) size 746x88 [bgcolor=#FFFF00]
206                 RenderText {#text} at (0,0) size 746x88
207                   text run at (0,0) width 746: "This paragraph is of class \"two\". Since the width has been set to 100%, it should automatically be as wide as"
208                   text run at (0,22) width 746: "its parent element allows it to be. Therefore, even though the element is floated, there is no room for other"
209                   text run at (0,44) width 746: "content on the sides and a orange square image should be seen AFTER the paragraph, not next to it. A yellow"
210                   text run at (0,66) width 479: "background has been added to this paragraph for diagnostic purposes."
211               RenderBlock (anonymous) at (4,154) size 746x110
212                 RenderImage {IMG} at (0,89) size 15x15
213                 RenderText {#text} at (15,88) size 4x22
214                   text run at (15,88) width 4: " "
215                 RenderBR {BR} at (19,104) size 0x0
216               RenderBlock {HR} at (4,272) size 746x2 [border: (1px inset #000000)]
217               RenderBlock (floating) {P} at (4,282) size 373x132 [bgcolor=#FFFF00]
218                 RenderText {#text} at (0,0) size 373x132
219                   text run at (0,0) width 373: "This paragraph is floated to the left and the orange"
220                   text run at (0,22) width 373: "square image should appear to the right of the"
221                   text run at (0,44) width 373: "paragraph. This paragraph has a yellow background"
222                   text run at (0,66) width 373: "and no padding, margin or border. The right edge of"
223                   text run at (0,88) width 373: "this yellow box should be horizontally aligned with the"
224                   text run at (0,110) width 268: "left edge of the yellow box undernearth."
225               RenderBlock (anonymous) at (4,282) size 746x132
226                 RenderImage {IMG} at (373,1) size 15x15
227                 RenderText {#text} at (388,0) size 4x22
228                   text run at (388,0) width 4: " "
229                 RenderBR {BR} at (392,16) size 0x0
230               RenderBlock {HR} at (4,422) size 746x2 [border: (1px inset #000000)]
231               RenderBlock (floating) {P} at (377,432) size 373x132 [bgcolor=#FFFF00]
232                 RenderText {#text} at (0,0) size 373x132
233                   text run at (0,0) width 373: "This paragraph is floated to the right (using a STYLE"
234                   text run at (0,22) width 373: "attribute) and the orange square image should appear"
235                   text run at (0,44) width 373: "to the left of the paragraph. This paragraph has a"
236                   text run at (0,66) width 373: "yellow background and no padding, margin or border."
237                   text run at (0,88) width 373: "The left edge of this yellow box should be horizonally"
238                   text run at (0,110) width 346: "aligned with the right edge of the yellow box above."
239               RenderBlock (anonymous) at (4,432) size 746x132
240                 RenderImage {IMG} at (0,1) size 15x15
241                 RenderText {#text} at (15,0) size 4x22
242                   text run at (15,0) width 4: " "
243                 RenderBR {BR} at (19,16) size 0x0
244               RenderBlock {HR} at (4,572) size 746x2 [border: (1px inset #000000)]
245               RenderBlock {P} at (4,582) size 746x88
246                 RenderBlock (floating) {SPAN} at (0,0) size 48x42 [bgcolor=#C0C0C0]
247                   RenderText {#text} at (0,0) size 21x42
248                     text run at (0,0) width 21: "T"
249                 RenderText {#text} at (48,0) size 746x88
250                   text run at (48,0) width 698: "he first letter (a \"T\") of this paragraph should float left and be twice the font-size of the rest of the"
251                   text run at (48,22) width 627: "paragraph, as well as bold, with a content width of 1.5em and a background-color of silver. "
252                   text run at (675,22) width 71: "The top of"
253                   text run at (0,44) width 746: "the big letter \"T\" should be vertically aligned with the top of the first line of this paragraph. This is commonly"
254                   text run at (0,66) width 153: "known as \"drop-cap\"."
255               RenderBlock (anonymous) at (4,670) size 746x22
256                 RenderBR {BR} at (0,0) size 0x22
257               RenderBlock {HR} at (4,700) size 746x2 [border: (1px inset #000000)]
258               RenderBlock (floating) {P} at (404,720) size 336x258 [bgcolor=#FFFF00] [border: (3px solid #FF0000)]
259                 RenderText {#text} at (8,8) size 320x242
260                   text run at (8,8) width 320: "This paragraph should be floated to the right,"
261                   text run at (8,30) width 320: "sort of like a 'sidebar' in a magazine article. Its"
262                   text run at (8,52) width 320: "width is 20em so the box should not be"
263                   text run at (8,74) width 320: "reformatted when the size of the viewport is"
264                   text run at (8,96) width 320: "changed (e.g. when the window is resized). The"
265                   text run at (8,118) width 320: "background color of the element is yellow, and"
266                   text run at (8,140) width 320: "there should be a 3px solid red border outside"
267                   text run at (8,162) width 320: "a 5px wide padding. Also, the element has a"
268                   text run at (8,184) width 320: "10px wide margin around it where the blue"
269                   text run at (8,206) width 320: "background of the paragraph in the normal"
270                   text run at (8,228) width 180: "flow should shine through."
271               RenderBlock {P} at (4,710) size 746x286 [bgcolor=#66CCFF]
272                 RenderText {#text} at (0,0) size 390x286
273                   text run at (0,0) width 390: "This paragraph is not floating. If there is enough room,"
274                   text run at (0,22) width 390: "the textual content of the paragraph should appear on"
275                   text run at (0,44) width 363: "the left side of the yellow \"sidebar\" on the right. "
276                   text run at (363,44) width 27: "The"
277                   text run at (0,66) width 390: "content of this element should flow around the floated"
278                   text run at (0,88) width 60: "element. "
279                   text run at (60,88) width 329: "However, the floated element may or may not be"
280                   text run at (0,110) width 390: "obscured by the blue background of this element, as the"
281                   text run at (0,132) width 355: "specification does not say which is drawn \"on top.\" "
282                   text run at (355,132) width 35: "Even"
283                   text run at (0,154) width 390: "if the floated element is obscured, it still forces the content"
284                   text run at (0,176) width 229: "of this element to flow around it. "
285                   text run at (229,176) width 160: "If the floated element is"
286                   text run at (0,198) width 390: "not obscured, then the blue rectangle of this paragraph"
287                   text run at (0,220) width 390: "should extend 10px above and to the right of the sidebar's"
288                   text run at (0,242) width 390: "red border, due to the margin styles set for the floated"
289                   text run at (0,264) width 56: "element."
290               RenderBlock (anonymous) at (4,996) size 746x22
291                 RenderBR {BR} at (0,0) size 0x22
292               RenderBlock {HR} at (4,1026) size 746x2 [border: (1px inset #000000)]
293               RenderBlock {DIV} at (4,1036) size 746x30 [bgcolor=#66CCFF] [border: (4px solid #FF0000)]
294                 RenderBlock (floating) {DIV} at (402,14) size 330x318 [bgcolor=#FFFF00]
295                   RenderBlock {P} at (5,5) size 320x308
296                     RenderText {#text} at (0,0) size 320x308
297                       text run at (0,0) width 320: "This paragraph is placed inside a DIV element"
298                       text run at (0,22) width 320: "which is floated to the right. The width of the"
299                       text run at (0,44) width 320: "DIV element is 20em. The background is"
300                       text run at (0,66) width 320: "yellow and there is a 5px padding, a 10px"
301                       text run at (0,88) width 320: "margin and no border. Since it is floated, the"
302                       text run at (0,110) width 320: "yellow box should be rendered on top of the"
303                       text run at (0,132) width 320: "background and borders of adjacent non-"
304                       text run at (0,154) width 320: "floated elements. To the left of this yellow box"
305                       text run at (0,176) width 320: "there should be a short paragraph with a blue"
306                       text run at (0,198) width 320: "background and a red border. The yellow box"
307                       text run at (0,220) width 320: "should be rendered on top of the bottom red"
308                       text run at (0,242) width 320: "border. I.e., the bottom red border will appear"
309                       text run at (0,264) width 320: "broken where it's overlaid by the yellow"
310                       text run at (0,286) width 66: "rectangle."
311                 RenderBlock {P} at (4,4) size 738x22
312                   RenderText {#text} at (0,0) size 286x22
313                     text run at (0,0) width 286: "See description in the box on the right side"
314               RenderBlock (anonymous) at (4,1066) size 746x312
315                 RenderBR {BR} at (0,0) size 0x22
316               RenderBlock {HR} at (4,1386) size 746x2 [border: (1px inset #000000)]
317               RenderBlock (floating) {DIV} at (4,1396) size 186x88 [bgcolor=#66CCFF]
318                 RenderBlock {P} at (0,0) size 186x88
319                   RenderText {#text} at (0,0) size 186x88
320                     text run at (0,0) width 186: "This paragraph is inside a"
321                     text run at (0,22) width 186: "DIV which is floated left."
322                     text run at (0,44) width 22: "Its "
323                     text run at (22,44) width 163: "background is blue and"
324                     text run at (0,66) width 118: "the width is 25%."
325               RenderBlock (floating) {DIV} at (564,1396) size 186x88 [bgcolor=#FFFF00]
326                 RenderBlock {P} at (0,0) size 186x88
327                   RenderText {#text} at (0,0) size 186x88
328                     text run at (0,0) width 186: "This paragraph is inside a"
329                     text run at (0,22) width 186: "DIV which is floated right."
330                     text run at (0,44) width 28: "Its "
331                     text run at (28,44) width 158: "background is yellow"
332                     text run at (0,66) width 148: "and the width is 25%."
333               RenderBlock {P} at (4,1396) size 746x44
334                 RenderText {#text} at (186,0) size 374x44
335                   text run at (186,0) width 374: "This paragraph should appear between a blue box (on"
336                   text run at (186,22) width 55: "the left) "
337                   text run at (241,22) width 211: "and a yellow box (on the right)."
338               RenderBlock (anonymous) at (4,1440) size 746x44
339                 RenderBR {BR} at (186,0) size 0x22
340               RenderBlock {HR} at (4,1492) size 746x2 [border: (1px inset #000000)]
341               RenderBlock (floating) {DIV} at (4,1502) size 559x176 [bgcolor=#66CCFF]
342                 RenderBlock (floating) {DIV} at (410,0) size 139x66 [bgcolor=#FFFF00]
343                   RenderBlock {P} at (0,0) size 139x66
344                     RenderText {#text} at (0,0) size 139x66
345                       text run at (0,0) width 139: "See description in"
346                       text run at (0,22) width 139: "the box on the left"
347                       text run at (0,44) width 30: "side."
348                 RenderBlock {P} at (0,0) size 559x176
349                   RenderText {#text} at (0,0) size 558x176
350                     text run at (0,0) width 410: "This paragraph is inside a DIV which is floated left. The"
351                     text run at (0,22) width 410: "background of the DIV element is blue and its width is 75%."
352                     text run at (0,44) width 36: "This "
353                     text run at (36,44) width 373: "text should all be inside the blue rectangle. The blue"
354                     text run at (0,66) width 34: "DIV "
355                     text run at (34,66) width 403: "element has another DIV element as a child. It has a yellow "
356                     text run at (437,66) width 121: "background color"
357                     text run at (0,88) width 257: "and is floated to the right. Since it is a "
358                     text run at (257,88) width 301: "child of the blue DIV, the yellow DIV should"
359                     text run at (0,110) width 123: "appear inside the "
360                     text run at (123,110) width 427: "blue rectangle. Due to it being floated to the right and having "
361                     text run at (550,110) width 8: "a"
362                     text run at (0,132) width 441: "10px right margin, the yellow rectange should have a 10px blue "
363                     text run at (441,132) width 117: "stripe on its right"
364                     text run at (0,154) width 30: "side."
365               RenderBlock (anonymous) at (4,1502) size 746x176
366                 RenderBR {BR} at (559,0) size 0x22
367               RenderBlock {HR} at (4,1686) size 746x2 [border: (1px inset #000000)]