mirror of
https://github.com/RGBCube/serenity
synced 2025-07-27 08:27:46 +00:00
LibWeb: Consider margins of atomic inlines in layout
According to CSS Inline Layout Module Level 3 § 2.2 Step 1. atomic inlines should be layed out in a line box based on their margin box. However, up until this patch we were unconditionally considering only the border box during line box height calculation. This made us essentially drop all vertical margins for atomic inlines.
This commit is contained in:
parent
0aa4466ce9
commit
b96920a9d6
11 changed files with 98 additions and 8 deletions
|
@ -0,0 +1,12 @@
|
|||
Viewport <#document> at (0,0) content-size 800x600 children: not-inline
|
||||
BlockContainer <html> at (0,0) content-size 800x191 children: not-inline
|
||||
BlockContainer <body> at (8,8) content-size 784x175 children: inline
|
||||
line 0 width: 210.828125, height: 175, bottom: 175, baseline: 13.53125
|
||||
frag 0 from TextNode start: 0, length: 6, rect: [8,8 43.125x17.46875]
|
||||
"Well, "
|
||||
frag 1 from BlockContainer start: 0, length: 0, rect: [51,58 100x100]
|
||||
frag 2 from TextNode start: 0, length: 9, rect: [151,8 67.703125x17.46875]
|
||||
" friends."
|
||||
TextNode <#text>
|
||||
BlockContainer <div#inline-box> at (51,58) content-size 100x100 inline-block children: not-inline
|
||||
TextNode <#text>
|
|
@ -0,0 +1,12 @@
|
|||
Viewport <#document> at (0,0) content-size 800x600 children: not-inline
|
||||
BlockContainer <html> at (0,0) content-size 800x194.46875 children: not-inline
|
||||
BlockContainer <body> at (8,8) content-size 784x178.46875 children: inline
|
||||
line 0 width: 210.828125, height: 178.46875, bottom: 178.46875, baseline: 175
|
||||
frag 0 from TextNode start: 0, length: 6, rect: [8,169 43.125x17.46875]
|
||||
"Well, "
|
||||
frag 1 from BlockContainer start: 0, length: 0, rect: [51,58 100x100]
|
||||
frag 2 from TextNode start: 0, length: 9, rect: [151,169 67.703125x17.46875]
|
||||
" friends."
|
||||
TextNode <#text>
|
||||
BlockContainer <div#inline-box> at (51,58) content-size 100x100 inline-block children: not-inline
|
||||
TextNode <#text>
|
|
@ -0,0 +1,12 @@
|
|||
Viewport <#document> at (0,0) content-size 800x600 children: not-inline
|
||||
BlockContainer <html> at (0,0) content-size 800x232.46875 children: not-inline
|
||||
BlockContainer <body> at (8,8) content-size 784x216.46875 children: inline
|
||||
line 0 width: 174.828125, height: 216.46875, bottom: 216.46875, baseline: 213
|
||||
frag 0 from TextNode start: 0, length: 6, rect: [8,207 43.125x17.46875]
|
||||
"Well, "
|
||||
frag 1 from ImageBox start: 0, length: 0, rect: [51,33 64x138]
|
||||
frag 2 from TextNode start: 0, length: 9, rect: [115,207 67.703125x17.46875]
|
||||
" friends."
|
||||
TextNode <#text>
|
||||
ImageBox <img#image> at (51,33) content-size 64x138 children: not-inline
|
||||
TextNode <#text>
|
Loading…
Add table
Add a link
Reference in a new issue