mirror of
https://github.com/LadybirdBrowser/ladybird.git
synced 2025-07-29 12:19:54 +00:00
LibWeb: Don't mess up the order of nodes when wrapping inline contents
Whenever we introduce a block element in a container that at that point has only had inline children, we create an anonymous wrapper for all the inline elements so we can keep the invariant that each container contains either inline or non-inline children. For some reason, we ignore all the out-of-flow nodes since they are layed out separately and it was thought that this shouldn't matter. However, if we are dealing with inline blocks and floating blocks, the order of the inline contents _including_ out-of-flow nodes becomes very important: floating blocks need to take the order of nodes into account when positioning themselves. Fix this by simply hoisting the out-of-flow nodes into the anonymous wrapper as well. Fixes the order of blocks in #4212. The gap is still not present.
This commit is contained in:
parent
d33445a4ea
commit
6f800caeaa
Notes:
github-actions[bot]
2025-04-24 17:13:52 +00:00
Author: https://github.com/gmta
Commit: 6f800caeaa
Pull-request: https://github.com/LadybirdBrowser/ladybird/pull/4448
14 changed files with 112 additions and 52 deletions
|
@ -19,8 +19,6 @@
|
||||||
#include <LibWeb/DOM/ShadowRoot.h>
|
#include <LibWeb/DOM/ShadowRoot.h>
|
||||||
#include <LibWeb/Dump.h>
|
#include <LibWeb/Dump.h>
|
||||||
#include <LibWeb/HTML/HTMLInputElement.h>
|
#include <LibWeb/HTML/HTMLInputElement.h>
|
||||||
#include <LibWeb/HTML/HTMLLIElement.h>
|
|
||||||
#include <LibWeb/HTML/HTMLOListElement.h>
|
|
||||||
#include <LibWeb/HTML/HTMLSlotElement.h>
|
#include <LibWeb/HTML/HTMLSlotElement.h>
|
||||||
#include <LibWeb/Layout/FieldSetBox.h>
|
#include <LibWeb/Layout/FieldSetBox.h>
|
||||||
#include <LibWeb/Layout/ListItemBox.h>
|
#include <LibWeb/Layout/ListItemBox.h>
|
||||||
|
@ -128,12 +126,8 @@ static Layout::Node& insertion_parent_for_block_node(Layout::NodeWithStyle& layo
|
||||||
|
|
||||||
// Parent block has inline-level children (our siblings); wrap these siblings into an anonymous wrapper block.
|
// Parent block has inline-level children (our siblings); wrap these siblings into an anonymous wrapper block.
|
||||||
Vector<GC::Ref<Node>> children;
|
Vector<GC::Ref<Node>> children;
|
||||||
for (GC::Ptr<Node> child = layout_parent.first_child(); child; child = child->next_sibling()) {
|
for (GC::Ptr<Node> child = layout_parent.first_child(); child; child = child->next_sibling())
|
||||||
// NOTE: We let out-of-flow children stay in the parent, to preserve tree structure.
|
|
||||||
if (child->is_out_of_flow())
|
|
||||||
continue;
|
|
||||||
children.append(*child);
|
children.append(*child);
|
||||||
}
|
|
||||||
|
|
||||||
auto wrapper = layout_parent.create_anonymous_wrapper();
|
auto wrapper = layout_parent.create_anonymous_wrapper();
|
||||||
wrapper->set_children_are_inline(true);
|
wrapper->set_children_are_inline(true);
|
||||||
|
|
|
@ -3,15 +3,15 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
|
||||||
BlockContainer <(anonymous)> at (0,0) content-size 800x0 children: inline
|
BlockContainer <(anonymous)> at (0,0) content-size 800x0 children: inline
|
||||||
TextNode <#text>
|
TextNode <#text>
|
||||||
BlockContainer <body> at (8,8) content-size 784x34 children: not-inline
|
BlockContainer <body> at (8,8) content-size 784x34 children: not-inline
|
||||||
BlockContainer <div.big-float> at (8,8) content-size 100x100 floating [BFC] children: not-inline
|
|
||||||
BlockContainer <div.xxx> at (108,8) content-size 29.109375x17 floating [BFC] children: inline
|
|
||||||
frag 0 from TextNode start: 0, length: 3, rect: [108,8 29.109375x17] baseline: 13.296875
|
|
||||||
"xxx"
|
|
||||||
TextNode <#text>
|
|
||||||
BlockContainer <(anonymous)> at (8,8) content-size 784x17 children: inline
|
BlockContainer <(anonymous)> at (8,8) content-size 784x17 children: inline
|
||||||
frag 0 from TextNode start: 1, length: 3, rect: [137.109375,8 27.640625x17] baseline: 13.296875
|
frag 0 from TextNode start: 1, length: 3, rect: [137.109375,8 27.640625x17] baseline: 13.296875
|
||||||
"bar"
|
"bar"
|
||||||
|
BlockContainer <div.big-float> at (8,8) content-size 100x100 floating [BFC] children: not-inline
|
||||||
TextNode <#text>
|
TextNode <#text>
|
||||||
|
BlockContainer <div.xxx> at (108,8) content-size 29.109375x17 floating [BFC] children: inline
|
||||||
|
frag 0 from TextNode start: 0, length: 3, rect: [108,8 29.109375x17] baseline: 13.296875
|
||||||
|
"xxx"
|
||||||
|
TextNode <#text>
|
||||||
TextNode <#text>
|
TextNode <#text>
|
||||||
BlockContainer <div> at (8,25) content-size 784x17 children: inline
|
BlockContainer <div> at (8,25) content-size 784x17 children: inline
|
||||||
frag 0 from TextNode start: 1, length: 3, rect: [129.515625,25 27.203125x17] baseline: 13.296875
|
frag 0 from TextNode start: 1, length: 3, rect: [129.515625,25 27.203125x17] baseline: 13.296875
|
||||||
|
@ -28,11 +28,11 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
|
||||||
ViewportPaintable (Viewport<#document>) [0,0 800x600]
|
ViewportPaintable (Viewport<#document>) [0,0 800x600]
|
||||||
PaintableWithLines (BlockContainer<HTML>) [0,0 800x108]
|
PaintableWithLines (BlockContainer<HTML>) [0,0 800x108]
|
||||||
PaintableWithLines (BlockContainer(anonymous)) [0,0 800x0]
|
PaintableWithLines (BlockContainer(anonymous)) [0,0 800x0]
|
||||||
PaintableWithLines (BlockContainer<BODY>) [8,8 784x34] overflow: [8,8 784x100]
|
PaintableWithLines (BlockContainer<BODY>) [8,8 784x34]
|
||||||
PaintableWithLines (BlockContainer<DIV>.big-float) [8,8 100x100]
|
|
||||||
PaintableWithLines (BlockContainer<DIV>.xxx) [108,8 29.109375x17]
|
|
||||||
TextPaintable (TextNode<#text>)
|
|
||||||
PaintableWithLines (BlockContainer(anonymous)) [8,8 784x17]
|
PaintableWithLines (BlockContainer(anonymous)) [8,8 784x17]
|
||||||
|
PaintableWithLines (BlockContainer<DIV>.big-float) [8,8 100x100]
|
||||||
|
PaintableWithLines (BlockContainer<DIV>.xxx) [108,8 29.109375x17]
|
||||||
|
TextPaintable (TextNode<#text>)
|
||||||
TextPaintable (TextNode<#text>)
|
TextPaintable (TextNode<#text>)
|
||||||
PaintableWithLines (BlockContainer<DIV>) [8,25 784x17]
|
PaintableWithLines (BlockContainer<DIV>) [8,25 784x17]
|
||||||
PaintableWithLines (BlockContainer<DIV>.yyy) [108,25 21.515625x17]
|
PaintableWithLines (BlockContainer<DIV>.yyy) [108,25 21.515625x17]
|
||||||
|
|
|
@ -2,9 +2,9 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
|
||||||
BlockContainer <html> at (0,0) content-size 800x600 [BFC] children: not-inline
|
BlockContainer <html> at (0,0) content-size 800x600 [BFC] children: not-inline
|
||||||
BlockContainer <body> at (8,8) content-size 784x100 children: not-inline
|
BlockContainer <body> at (8,8) content-size 784x100 children: not-inline
|
||||||
BlockContainer <div> at (8,8) content-size 784x100 children: not-inline
|
BlockContainer <div> at (8,8) content-size 784x100 children: not-inline
|
||||||
BlockContainer <div.square.white> at (8,8) content-size 100x100 floating [BFC] children: not-inline
|
|
||||||
BlockContainer <(anonymous)> at (8,8) content-size 784x0 children: inline
|
BlockContainer <(anonymous)> at (8,8) content-size 784x0 children: inline
|
||||||
TextNode <#text>
|
TextNode <#text>
|
||||||
|
BlockContainer <div.square.white> at (8,8) content-size 100x100 floating [BFC] children: not-inline
|
||||||
TextNode <#text>
|
TextNode <#text>
|
||||||
BlockContainer <div.clearfix> at (8,108) content-size 784x0 children: not-inline
|
BlockContainer <div.clearfix> at (8,108) content-size 784x0 children: not-inline
|
||||||
BlockContainer <(anonymous)> at (8,108) content-size 784x0 children: inline
|
BlockContainer <(anonymous)> at (8,108) content-size 784x0 children: inline
|
||||||
|
@ -18,8 +18,8 @@ ViewportPaintable (Viewport<#document>) [0,0 800x600]
|
||||||
PaintableWithLines (BlockContainer<HTML>) [0,0 800x600]
|
PaintableWithLines (BlockContainer<HTML>) [0,0 800x600]
|
||||||
PaintableWithLines (BlockContainer<BODY>) [8,8 784x100]
|
PaintableWithLines (BlockContainer<BODY>) [8,8 784x100]
|
||||||
PaintableWithLines (BlockContainer<DIV>) [8,8 784x100]
|
PaintableWithLines (BlockContainer<DIV>) [8,8 784x100]
|
||||||
PaintableWithLines (BlockContainer<DIV>.square.white) [8,8 100x100]
|
|
||||||
PaintableWithLines (BlockContainer(anonymous)) [8,8 784x0]
|
PaintableWithLines (BlockContainer(anonymous)) [8,8 784x0]
|
||||||
|
PaintableWithLines (BlockContainer<DIV>.square.white) [8,8 100x100]
|
||||||
PaintableWithLines (BlockContainer<DIV>.clearfix) [8,108 784x0]
|
PaintableWithLines (BlockContainer<DIV>.clearfix) [8,108 784x0]
|
||||||
PaintableWithLines (BlockContainer(anonymous)) [8,108 784x0]
|
PaintableWithLines (BlockContainer(anonymous)) [8,108 784x0]
|
||||||
PaintableWithLines (BlockContainer<DIV>.square.black) [8,108 49x49]
|
PaintableWithLines (BlockContainer<DIV>.square.black) [8,108 49x49]
|
||||||
|
|
|
@ -3,9 +3,9 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
|
||||||
BlockContainer <(anonymous)> at (0,0) content-size 800x0 children: inline
|
BlockContainer <(anonymous)> at (0,0) content-size 800x0 children: inline
|
||||||
TextNode <#text>
|
TextNode <#text>
|
||||||
BlockContainer <body> at (8,8) content-size 784x17 children: not-inline
|
BlockContainer <body> at (8,8) content-size 784x17 children: not-inline
|
||||||
BlockContainer <div#b> at (9,9) content-size 50x50 floating [BFC] children: not-inline
|
|
||||||
BlockContainer <(anonymous)> at (8,8) content-size 784x0 children: inline
|
BlockContainer <(anonymous)> at (8,8) content-size 784x0 children: inline
|
||||||
TextNode <#text>
|
TextNode <#text>
|
||||||
|
BlockContainer <div#b> at (9,9) content-size 50x50 floating [BFC] children: not-inline
|
||||||
TextNode <#text>
|
TextNode <#text>
|
||||||
BlockContainer <div#a> at (8,8) content-size 784x17 children: inline
|
BlockContainer <div#a> at (8,8) content-size 784x17 children: inline
|
||||||
frag 0 from TextNode start: 0, length: 4, rect: [60,8 37.578125x17] baseline: 13.296875
|
frag 0 from TextNode start: 0, length: 4, rect: [60,8 37.578125x17] baseline: 13.296875
|
||||||
|
@ -17,9 +17,9 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
|
||||||
ViewportPaintable (Viewport<#document>) [0,0 800x600]
|
ViewportPaintable (Viewport<#document>) [0,0 800x600]
|
||||||
PaintableWithLines (BlockContainer<HTML>) [0,0 800x60]
|
PaintableWithLines (BlockContainer<HTML>) [0,0 800x60]
|
||||||
PaintableWithLines (BlockContainer(anonymous)) [0,0 800x0]
|
PaintableWithLines (BlockContainer(anonymous)) [0,0 800x0]
|
||||||
PaintableWithLines (BlockContainer<BODY>) [8,8 784x17] overflow: [8,8 784x52]
|
PaintableWithLines (BlockContainer<BODY>) [8,8 784x17]
|
||||||
PaintableWithLines (BlockContainer<DIV>#b) [8,8 52x52]
|
|
||||||
PaintableWithLines (BlockContainer(anonymous)) [8,8 784x0]
|
PaintableWithLines (BlockContainer(anonymous)) [8,8 784x0]
|
||||||
|
PaintableWithLines (BlockContainer<DIV>#b) [8,8 52x52]
|
||||||
PaintableWithLines (BlockContainer<DIV>#a) [8,8 784x17]
|
PaintableWithLines (BlockContainer<DIV>#a) [8,8 784x17]
|
||||||
TextPaintable (TextNode<#text>)
|
TextPaintable (TextNode<#text>)
|
||||||
PaintableWithLines (BlockContainer(anonymous)) [8,25 784x0]
|
PaintableWithLines (BlockContainer(anonymous)) [8,25 784x0]
|
||||||
|
|
|
@ -1,8 +1,8 @@
|
||||||
Viewport <#document> at (0,0) content-size 800x600 children: not-inline
|
Viewport <#document> at (0,0) content-size 800x600 children: not-inline
|
||||||
BlockContainer <html> at (0,0) content-size 800x157 [BFC] children: not-inline
|
BlockContainer <html> at (0,0) content-size 800x157 [BFC] children: not-inline
|
||||||
BlockContainer <body> at (8,8) content-size 784x133 children: not-inline
|
BlockContainer <body> at (8,8) content-size 784x133 children: not-inline
|
||||||
BlockContainer <div.a> at (8,8) content-size 100x100 floating [BFC] children: not-inline
|
|
||||||
BlockContainer <(anonymous)> at (8,8) content-size 784x100 children: inline
|
BlockContainer <(anonymous)> at (8,8) content-size 784x100 children: inline
|
||||||
|
BlockContainer <div.a> at (8,8) content-size 100x100 floating [BFC] children: not-inline
|
||||||
TextNode <#text>
|
TextNode <#text>
|
||||||
BreakNode <br.b>
|
BreakNode <br.b>
|
||||||
TextNode <#text>
|
TextNode <#text>
|
||||||
|
@ -16,8 +16,8 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
|
||||||
ViewportPaintable (Viewport<#document>) [0,0 800x600]
|
ViewportPaintable (Viewport<#document>) [0,0 800x600]
|
||||||
PaintableWithLines (BlockContainer<HTML>) [0,0 800x157]
|
PaintableWithLines (BlockContainer<HTML>) [0,0 800x157]
|
||||||
PaintableWithLines (BlockContainer<BODY>) [8,8 784x133]
|
PaintableWithLines (BlockContainer<BODY>) [8,8 784x133]
|
||||||
PaintableWithLines (BlockContainer<DIV>.a) [8,8 100x100]
|
|
||||||
PaintableWithLines (BlockContainer(anonymous)) [8,8 784x100]
|
PaintableWithLines (BlockContainer(anonymous)) [8,8 784x100]
|
||||||
|
PaintableWithLines (BlockContainer<DIV>.a) [8,8 100x100]
|
||||||
PaintableWithLines (BlockContainer<P>) [8,124 784x17]
|
PaintableWithLines (BlockContainer<P>) [8,124 784x17]
|
||||||
TextPaintable (TextNode<#text>)
|
TextPaintable (TextNode<#text>)
|
||||||
PaintableWithLines (BlockContainer(anonymous)) [8,157 784x0]
|
PaintableWithLines (BlockContainer(anonymous)) [8,157 784x0]
|
||||||
|
|
|
@ -1,8 +1,8 @@
|
||||||
Viewport <#document> at (0,0) content-size 800x600 children: not-inline
|
Viewport <#document> at (0,0) content-size 800x600 children: not-inline
|
||||||
BlockContainer <html> at (0,0) content-size 650x466 [BFC] children: not-inline
|
BlockContainer <html> at (0,0) content-size 650x466 [BFC] children: not-inline
|
||||||
BlockContainer <body> at (8,16) content-size 634x384 children: not-inline
|
BlockContainer <body> at (8,16) content-size 634x384 children: not-inline
|
||||||
BlockContainer <div.a> at (342,16) content-size 300x225 floating [BFC] children: not-inline
|
|
||||||
BlockContainer <(anonymous)> at (8,16) content-size 634x0 children: inline
|
BlockContainer <(anonymous)> at (8,16) content-size 634x0 children: inline
|
||||||
|
BlockContainer <div.a> at (342,16) content-size 300x225 floating [BFC] children: not-inline
|
||||||
TextNode <#text>
|
TextNode <#text>
|
||||||
BlockContainer <p> at (8,16) content-size 634x68 children: inline
|
BlockContainer <p> at (8,16) content-size 634x68 children: inline
|
||||||
frag 0 from TextNode start: 0, length: 27, rect: [8,16 232.84375x17] baseline: 13.296875
|
frag 0 from TextNode start: 0, length: 27, rect: [8,16 232.84375x17] baseline: 13.296875
|
||||||
|
@ -25,8 +25,8 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
|
||||||
ViewportPaintable (Viewport<#document>) [0,0 800x600]
|
ViewportPaintable (Viewport<#document>) [0,0 800x600]
|
||||||
PaintableWithLines (BlockContainer<HTML>) [0,0 650x466]
|
PaintableWithLines (BlockContainer<HTML>) [0,0 650x466]
|
||||||
PaintableWithLines (BlockContainer<BODY>) [8,16 634x384]
|
PaintableWithLines (BlockContainer<BODY>) [8,16 634x384]
|
||||||
PaintableWithLines (BlockContainer<DIV>.a) [342,16 300x225]
|
|
||||||
PaintableWithLines (BlockContainer(anonymous)) [8,16 634x0]
|
PaintableWithLines (BlockContainer(anonymous)) [8,16 634x0]
|
||||||
|
PaintableWithLines (BlockContainer<DIV>.a) [342,16 300x225]
|
||||||
PaintableWithLines (BlockContainer<P>) [8,16 634x68]
|
PaintableWithLines (BlockContainer<P>) [8,16 634x68]
|
||||||
TextPaintable (TextNode<#text>)
|
TextPaintable (TextNode<#text>)
|
||||||
PaintableWithLines (BlockContainer(anonymous)) [8,100 634x0]
|
PaintableWithLines (BlockContainer(anonymous)) [8,100 634x0]
|
||||||
|
|
|
@ -1,8 +1,8 @@
|
||||||
Viewport <#document> at (0,0) content-size 800x600 children: not-inline
|
Viewport <#document> at (0,0) content-size 800x600 children: not-inline
|
||||||
BlockContainer <html> at (0,0) content-size 800x600 [BFC] children: not-inline
|
BlockContainer <html> at (0,0) content-size 800x600 [BFC] children: not-inline
|
||||||
BlockContainer <body> at (8,16) content-size 784x51 children: not-inline
|
BlockContainer <body> at (8,16) content-size 784x51 children: not-inline
|
||||||
BlockContainer <div> at (8,16) content-size 50x50 floating [BFC] children: not-inline
|
|
||||||
BlockContainer <(anonymous)> at (8,16) content-size 784x0 children: inline
|
BlockContainer <(anonymous)> at (8,16) content-size 784x0 children: inline
|
||||||
|
BlockContainer <div> at (8,16) content-size 50x50 floating [BFC] children: not-inline
|
||||||
TextNode <#text>
|
TextNode <#text>
|
||||||
BlockContainer <p> at (8,16) content-size 784x51 children: inline
|
BlockContainer <p> at (8,16) content-size 784x51 children: inline
|
||||||
frag 0 from TextNode start: 0, length: 1, rect: [58,16 14.265625x17] baseline: 13.296875
|
frag 0 from TextNode start: 0, length: 1, rect: [58,16 14.265625x17] baseline: 13.296875
|
||||||
|
@ -23,8 +23,8 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
|
||||||
ViewportPaintable (Viewport<#document>) [0,0 800x600]
|
ViewportPaintable (Viewport<#document>) [0,0 800x600]
|
||||||
PaintableWithLines (BlockContainer<HTML>) [0,0 800x600]
|
PaintableWithLines (BlockContainer<HTML>) [0,0 800x600]
|
||||||
PaintableWithLines (BlockContainer<BODY>) [8,16 784x51] overflow: [8,16 784x117]
|
PaintableWithLines (BlockContainer<BODY>) [8,16 784x51] overflow: [8,16 784x117]
|
||||||
PaintableWithLines (BlockContainer<DIV>) [8,16 50x50]
|
|
||||||
PaintableWithLines (BlockContainer(anonymous)) [8,16 784x0]
|
PaintableWithLines (BlockContainer(anonymous)) [8,16 784x0]
|
||||||
|
PaintableWithLines (BlockContainer<DIV>) [8,16 50x50]
|
||||||
PaintableWithLines (BlockContainer<P>) [8,16 784x51]
|
PaintableWithLines (BlockContainer<P>) [8,16 784x51]
|
||||||
TextPaintable (TextNode<#text>)
|
TextPaintable (TextNode<#text>)
|
||||||
TextPaintable (TextNode<#text>)
|
TextPaintable (TextNode<#text>)
|
||||||
|
|
|
@ -0,0 +1,40 @@
|
||||||
|
Viewport <#document> at (0,0) content-size 800x600 children: not-inline
|
||||||
|
BlockContainer <html> at (0,0) content-size 800x308 [BFC] children: not-inline
|
||||||
|
BlockContainer <body> at (8,8) content-size 784x103 children: not-inline
|
||||||
|
BlockContainer <(anonymous)> at (8,8) content-size 784x103 children: inline
|
||||||
|
frag 0 from BlockContainer start: 0, length: 0, rect: [8,8 100x100] baseline: 100
|
||||||
|
frag 1 from TextNode start: 0, length: 1, rect: [108,94 8x17] baseline: 13.296875
|
||||||
|
" "
|
||||||
|
frag 2 from BlockContainer start: 0, length: 0, rect: [116,8 100x100] baseline: 100
|
||||||
|
TextNode <#text>
|
||||||
|
BlockContainer <div.a> at (8,8) content-size 100x100 inline-block [BFC] children: not-inline
|
||||||
|
BlockContainer <div.box.green> at (8,8) content-size 100x100 children: not-inline
|
||||||
|
TextNode <#text>
|
||||||
|
BlockContainer <div.b> at (8,108) content-size 784x100 floating [BFC] children: not-inline
|
||||||
|
BlockContainer <div.box.blue> at (8,108) content-size 100x100 children: not-inline
|
||||||
|
TextNode <#text>
|
||||||
|
BlockContainer <div.a> at (116,8) content-size 100x100 inline-block [BFC] children: not-inline
|
||||||
|
BlockContainer <div.box.green> at (116,8) content-size 100x100 children: not-inline
|
||||||
|
TextNode <#text>
|
||||||
|
BlockContainer <div.b> at (8,208) content-size 784x100 floating [BFC] children: not-inline
|
||||||
|
BlockContainer <div.box.blue> at (8,208) content-size 100x100 children: not-inline
|
||||||
|
TextNode <#text>
|
||||||
|
BlockContainer <div> at (8,111) content-size 784x0 children: not-inline
|
||||||
|
BlockContainer <(anonymous)> at (8,111) content-size 784x0 children: inline
|
||||||
|
TextNode <#text>
|
||||||
|
|
||||||
|
ViewportPaintable (Viewport<#document>) [0,0 800x600]
|
||||||
|
PaintableWithLines (BlockContainer<HTML>) [0,0 800x308]
|
||||||
|
PaintableWithLines (BlockContainer<BODY>) [8,8 784x103]
|
||||||
|
PaintableWithLines (BlockContainer(anonymous)) [8,8 784x103]
|
||||||
|
PaintableWithLines (BlockContainer<DIV>.a) [8,8 100x100]
|
||||||
|
PaintableWithLines (BlockContainer<DIV>.box.green) [8,8 100x100]
|
||||||
|
TextPaintable (TextNode<#text>)
|
||||||
|
PaintableWithLines (BlockContainer<DIV>.b) [8,108 784x100]
|
||||||
|
PaintableWithLines (BlockContainer<DIV>.box.blue) [8,108 100x100]
|
||||||
|
PaintableWithLines (BlockContainer<DIV>.a) [116,8 100x100]
|
||||||
|
PaintableWithLines (BlockContainer<DIV>.box.green) [116,8 100x100]
|
||||||
|
PaintableWithLines (BlockContainer<DIV>.b) [8,208 784x100]
|
||||||
|
PaintableWithLines (BlockContainer<DIV>.box.blue) [8,208 100x100]
|
||||||
|
PaintableWithLines (BlockContainer<DIV>) [8,111 784x0]
|
||||||
|
PaintableWithLines (BlockContainer(anonymous)) [8,111 784x0]
|
|
@ -3,19 +3,19 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
|
||||||
BlockContainer <(anonymous)> at (0,0) content-size 800x0 children: inline
|
BlockContainer <(anonymous)> at (0,0) content-size 800x0 children: inline
|
||||||
TextNode <#text>
|
TextNode <#text>
|
||||||
BlockContainer <body> at (8,8) content-size 784x600 children: not-inline
|
BlockContainer <body> at (8,8) content-size 784x600 children: not-inline
|
||||||
BlockContainer <div.blue.absolute> at (208,208) content-size 200x200 positioned [BFC] children: inline
|
|
||||||
TextNode <#text>
|
|
||||||
BlockContainer <div.red.absolute> at (308,308) content-size 100x100 positioned [BFC] children: not-inline
|
|
||||||
TextNode <#text>
|
|
||||||
BlockContainer <div.yellow.absolute> at (258,258) content-size 100x100 positioned [BFC] children: inline
|
|
||||||
TextNode <#text>
|
|
||||||
BlockContainer <div.black.absolute> at (308,308) content-size 50x50 positioned [BFC] children: not-inline
|
|
||||||
TextNode <#text>
|
|
||||||
TextNode <#text>
|
|
||||||
BlockContainer <div.green.absolute> at (508,508) content-size 100x100 positioned [BFC] children: not-inline
|
|
||||||
TextNode <#text>
|
|
||||||
BlockContainer <(anonymous)> at (8,8) content-size 784x0 children: inline
|
BlockContainer <(anonymous)> at (8,8) content-size 784x0 children: inline
|
||||||
TextNode <#text>
|
TextNode <#text>
|
||||||
|
BlockContainer <div.blue.absolute> at (208,208) content-size 200x200 positioned [BFC] children: inline
|
||||||
|
TextNode <#text>
|
||||||
|
BlockContainer <div.red.absolute> at (308,308) content-size 100x100 positioned [BFC] children: not-inline
|
||||||
|
TextNode <#text>
|
||||||
|
BlockContainer <div.yellow.absolute> at (258,258) content-size 100x100 positioned [BFC] children: inline
|
||||||
|
TextNode <#text>
|
||||||
|
BlockContainer <div.black.absolute> at (308,308) content-size 50x50 positioned [BFC] children: not-inline
|
||||||
|
TextNode <#text>
|
||||||
|
TextNode <#text>
|
||||||
|
BlockContainer <div.green.absolute> at (508,508) content-size 100x100 positioned [BFC] children: not-inline
|
||||||
|
TextNode <#text>
|
||||||
TextNode <#text>
|
TextNode <#text>
|
||||||
BlockContainer <div.blue> at (8,8) content-size 200x200 children: not-inline
|
BlockContainer <div.blue> at (8,8) content-size 200x200 children: not-inline
|
||||||
BlockContainer <(anonymous)> at (8,8) content-size 200x0 children: inline
|
BlockContainer <(anonymous)> at (8,8) content-size 200x0 children: inline
|
||||||
|
@ -39,12 +39,12 @@ ViewportPaintable (Viewport<#document>) [0,0 800x600] overflow: [0,0 800x616]
|
||||||
PaintableWithLines (BlockContainer<HTML>) [0,0 800x616]
|
PaintableWithLines (BlockContainer<HTML>) [0,0 800x616]
|
||||||
PaintableWithLines (BlockContainer(anonymous)) [0,0 800x0]
|
PaintableWithLines (BlockContainer(anonymous)) [0,0 800x0]
|
||||||
PaintableWithLines (BlockContainer<BODY>) [8,8 784x600]
|
PaintableWithLines (BlockContainer<BODY>) [8,8 784x600]
|
||||||
PaintableWithLines (BlockContainer<DIV>.blue.absolute) [208,208 200x200]
|
|
||||||
PaintableWithLines (BlockContainer<DIV>.red.absolute) [308,308 100x100]
|
|
||||||
PaintableWithLines (BlockContainer<DIV>.yellow.absolute) [258,258 100x100]
|
|
||||||
PaintableWithLines (BlockContainer<DIV>.black.absolute) [308,308 50x50]
|
|
||||||
PaintableWithLines (BlockContainer<DIV>.green.absolute) [508,508 100x100]
|
|
||||||
PaintableWithLines (BlockContainer(anonymous)) [8,8 784x0]
|
PaintableWithLines (BlockContainer(anonymous)) [8,8 784x0]
|
||||||
|
PaintableWithLines (BlockContainer<DIV>.blue.absolute) [208,208 200x200]
|
||||||
|
PaintableWithLines (BlockContainer<DIV>.red.absolute) [308,308 100x100]
|
||||||
|
PaintableWithLines (BlockContainer<DIV>.yellow.absolute) [258,258 100x100]
|
||||||
|
PaintableWithLines (BlockContainer<DIV>.black.absolute) [308,308 50x50]
|
||||||
|
PaintableWithLines (BlockContainer<DIV>.green.absolute) [508,508 100x100]
|
||||||
PaintableWithLines (BlockContainer<DIV>.blue) [8,8 200x200] overflow: [8,8 200x300]
|
PaintableWithLines (BlockContainer<DIV>.blue) [8,8 200x200] overflow: [8,8 200x300]
|
||||||
PaintableWithLines (BlockContainer(anonymous)) [8,8 200x0]
|
PaintableWithLines (BlockContainer(anonymous)) [8,8 200x0]
|
||||||
PaintableWithLines (BlockContainer<DIV>.red) [8,8 100x100]
|
PaintableWithLines (BlockContainer<DIV>.red) [8,8 100x100]
|
||||||
|
|
|
@ -9,9 +9,9 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
|
||||||
BlockContainer <(anonymous)> at (8,16) content-size 1280x0 children: inline
|
BlockContainer <(anonymous)> at (8,16) content-size 1280x0 children: inline
|
||||||
TextNode <#text>
|
TextNode <#text>
|
||||||
BlockContainer <div> at (8,16) content-size 1280x400 children: not-inline
|
BlockContainer <div> at (8,16) content-size 1280x400 children: not-inline
|
||||||
ImageBox <img> at (488,16) content-size 800x400 floating children: not-inline
|
|
||||||
BlockContainer <(anonymous)> at (8,16) content-size 1280x0 children: inline
|
BlockContainer <(anonymous)> at (8,16) content-size 1280x0 children: inline
|
||||||
TextNode <#text>
|
TextNode <#text>
|
||||||
|
ImageBox <img> at (488,16) content-size 800x0 floating children: not-inline
|
||||||
TextNode <#text>
|
TextNode <#text>
|
||||||
BlockContainer <p> at (8,16) content-size 1280x17 children: inline
|
BlockContainer <p> at (8,16) content-size 1280x17 children: inline
|
||||||
frag 0 from TextNode start: 0, length: 4, rect: [8,16 37.21875x17] baseline: 13.296875
|
frag 0 from TextNode start: 0, length: 4, rect: [8,16 37.21875x17] baseline: 13.296875
|
||||||
|
@ -32,8 +32,8 @@ ViewportPaintable (Viewport<#document>) [0,0 800x600] overflow: [0,0 1288x824]
|
||||||
PaintableWithLines (BlockContainer<DIV>.foo) [8,16 1280x800]
|
PaintableWithLines (BlockContainer<DIV>.foo) [8,16 1280x800]
|
||||||
PaintableWithLines (BlockContainer(anonymous)) [8,16 1280x0]
|
PaintableWithLines (BlockContainer(anonymous)) [8,16 1280x0]
|
||||||
PaintableWithLines (BlockContainer<DIV>) [8,16 1280x400]
|
PaintableWithLines (BlockContainer<DIV>) [8,16 1280x400]
|
||||||
ImagePaintable (ImageBox<IMG>) [488,16 800x400]
|
|
||||||
PaintableWithLines (BlockContainer(anonymous)) [8,16 1280x0]
|
PaintableWithLines (BlockContainer(anonymous)) [8,16 1280x0]
|
||||||
|
ImagePaintable (ImageBox<IMG>) [488,16 800x0]
|
||||||
PaintableWithLines (BlockContainer<P>) [8,16 1280x17]
|
PaintableWithLines (BlockContainer<P>) [8,16 1280x17]
|
||||||
TextPaintable (TextNode<#text>)
|
TextPaintable (TextNode<#text>)
|
||||||
PaintableWithLines (BlockContainer(anonymous)) [8,49 1280x0]
|
PaintableWithLines (BlockContainer(anonymous)) [8,49 1280x0]
|
||||||
|
|
|
@ -3,9 +3,9 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
|
||||||
BlockContainer <(anonymous)> at (0,0) content-size 800x0 children: inline
|
BlockContainer <(anonymous)> at (0,0) content-size 800x0 children: inline
|
||||||
TextNode <#text>
|
TextNode <#text>
|
||||||
BlockContainer <body> at (8,16) content-size 784x17 children: not-inline
|
BlockContainer <body> at (8,16) content-size 784x17 children: not-inline
|
||||||
ImageBox <img> at (8,16) content-size 200x100 floating children: not-inline
|
|
||||||
BlockContainer <(anonymous)> at (8,16) content-size 784x0 children: inline
|
BlockContainer <(anonymous)> at (8,16) content-size 784x0 children: inline
|
||||||
TextNode <#text>
|
TextNode <#text>
|
||||||
|
ImageBox <img> at (8,16) content-size 200x100 floating children: not-inline
|
||||||
TextNode <#text>
|
TextNode <#text>
|
||||||
BlockContainer <p> at (8,16) content-size 784x17 children: inline
|
BlockContainer <p> at (8,16) content-size 784x17 children: inline
|
||||||
frag 0 from TextNode start: 0, length: 4, rect: [228,16 37.21875x17] baseline: 13.296875
|
frag 0 from TextNode start: 0, length: 4, rect: [228,16 37.21875x17] baseline: 13.296875
|
||||||
|
@ -17,9 +17,9 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
|
||||||
ViewportPaintable (Viewport<#document>) [0,0 800x600]
|
ViewportPaintable (Viewport<#document>) [0,0 800x600]
|
||||||
PaintableWithLines (BlockContainer<HTML>) [0,0 800x116]
|
PaintableWithLines (BlockContainer<HTML>) [0,0 800x116]
|
||||||
PaintableWithLines (BlockContainer(anonymous)) [0,0 800x0]
|
PaintableWithLines (BlockContainer(anonymous)) [0,0 800x0]
|
||||||
PaintableWithLines (BlockContainer<BODY>) [8,16 784x17] overflow: [8,16 784x100]
|
PaintableWithLines (BlockContainer<BODY>) [8,16 784x17]
|
||||||
ImagePaintable (ImageBox<IMG>) [8,16 200x100]
|
|
||||||
PaintableWithLines (BlockContainer(anonymous)) [8,16 784x0]
|
PaintableWithLines (BlockContainer(anonymous)) [8,16 784x0]
|
||||||
|
ImagePaintable (ImageBox<IMG>) [8,16 200x100]
|
||||||
PaintableWithLines (BlockContainer<P>) [8,16 784x17]
|
PaintableWithLines (BlockContainer<P>) [8,16 784x17]
|
||||||
TextPaintable (TextNode<#text>)
|
TextPaintable (TextNode<#text>)
|
||||||
PaintableWithLines (BlockContainer(anonymous)) [8,49 784x0]
|
PaintableWithLines (BlockContainer(anonymous)) [8,49 784x0]
|
||||||
|
|
|
@ -1,8 +1,8 @@
|
||||||
Viewport <#document> at (0,0) content-size 800x600 children: not-inline
|
Viewport <#document> at (0,0) content-size 800x600 children: not-inline
|
||||||
BlockContainer <html> at (0,0) content-size 800x39 [BFC] children: not-inline
|
BlockContainer <html> at (0,0) content-size 800x39 [BFC] children: not-inline
|
||||||
BlockContainer <body> at (8,8) content-size 784x23 children: not-inline
|
BlockContainer <body> at (8,8) content-size 784x23 children: not-inline
|
||||||
BlockContainer <div.ref> at (186,10) content-size 16x16 positioned [BFC] children: not-inline
|
|
||||||
BlockContainer <(anonymous)> at (8,8) content-size 784x0 children: inline
|
BlockContainer <(anonymous)> at (8,8) content-size 784x0 children: inline
|
||||||
|
BlockContainer <div.ref> at (186,10) content-size 16x16 positioned [BFC] children: not-inline
|
||||||
TextNode <#text>
|
TextNode <#text>
|
||||||
BlockContainer <div.test> at (8,8) content-size 784x23 children: inline
|
BlockContainer <div.test> at (8,8) content-size 784x23 children: inline
|
||||||
frag 0 from TextNode start: 0, length: 1, rect: [8,17 148x14] baseline: 10.890625
|
frag 0 from TextNode start: 0, length: 1, rect: [8,17 148x14] baseline: 10.890625
|
||||||
|
@ -16,8 +16,8 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
|
||||||
ViewportPaintable (Viewport<#document>) [0,0 800x600]
|
ViewportPaintable (Viewport<#document>) [0,0 800x600]
|
||||||
PaintableWithLines (BlockContainer<HTML>) [0,0 800x39]
|
PaintableWithLines (BlockContainer<HTML>) [0,0 800x39]
|
||||||
PaintableWithLines (BlockContainer<BODY>) [8,8 784x23]
|
PaintableWithLines (BlockContainer<BODY>) [8,8 784x23]
|
||||||
PaintableWithLines (BlockContainer<DIV>.ref) [184,8 20x20]
|
|
||||||
PaintableWithLines (BlockContainer(anonymous)) [8,8 784x0]
|
PaintableWithLines (BlockContainer(anonymous)) [8,8 784x0]
|
||||||
|
PaintableWithLines (BlockContainer<DIV>.ref) [184,8 20x20]
|
||||||
PaintableWithLines (BlockContainer<DIV>.test) [8,8 784x23]
|
PaintableWithLines (BlockContainer<DIV>.test) [8,8 784x23]
|
||||||
TextPaintable (TextNode<#text>)
|
TextPaintable (TextNode<#text>)
|
||||||
PaintableWithLines (BlockContainer<SPAN>) [156,8 20x20]
|
PaintableWithLines (BlockContainer<SPAN>) [156,8 20x20]
|
||||||
|
|
|
@ -0,0 +1,26 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<style>
|
||||||
|
.a {
|
||||||
|
display: inline-block;
|
||||||
|
}
|
||||||
|
.b {
|
||||||
|
float: left;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
.box {
|
||||||
|
height: 100px;
|
||||||
|
width: 100px;
|
||||||
|
}
|
||||||
|
.green {
|
||||||
|
background-color: green;
|
||||||
|
}
|
||||||
|
.blue {
|
||||||
|
background-color: blue;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
<body>
|
||||||
|
<div class="a"><div class="box green"></div></div>
|
||||||
|
<div class="b"><div class="box blue"></div></div>
|
||||||
|
<div class="a"><div class="box green"></div></div>
|
||||||
|
<div class="b"><div class="box blue"></div></div>
|
||||||
|
<div></div><!-- This last <div> requires hoisting all inline content into an anonymous wrapper -->
|
|
@ -2,5 +2,5 @@ Harness status: OK
|
||||||
|
|
||||||
Found 1 tests
|
Found 1 tests
|
||||||
|
|
||||||
1 Fail
|
1 Pass
|
||||||
Fail #container 1
|
Pass #container 1
|
Loading…
Add table
Add a link
Reference in a new issue