mirror of
https://github.com/RGBCube/serenity
synced 2025-05-31 18:28:12 +00:00
ab4cf7c57d
In case flex items had `margin: auto` on the primary flex axis, we were still also distributing remaining space according to `justify-content` rules. This lead to duplicated spacing in various places and overflows. It looks like this issue was observed previously but missidentified because there was logic to ignore margins at the start and end which would partially paper over the root cause. However this created other bugs (like for example not having a margin at beginning and end ;-)) and I can find nothing in the spec or other browser behaviour that indicates that this is something that should be done. Now we skip justify-content space distribution alltogether if it has already been distributed to auto margins.
21 lines
1.4 KiB
Text
21 lines
1.4 KiB
Text
Viewport <#document> at (0,0) content-size 800x600 children: not-inline
|
|
BlockContainer <html> at (0,0) content-size 800x70 children: not-inline
|
|
BlockContainer <body> at (8,8) content-size 784x54 children: not-inline
|
|
Box <div.container> at (9,9) content-size 600x52 flex-container(row) children: not-inline
|
|
BlockContainer <div.box> at (20,10) content-size 150x50 flex-item children: inline
|
|
line 0 width: 86.359375, height: 17.46875, bottom: 17.46875, baseline: 13.53125
|
|
frag 0 from TextNode start: 0, length: 11, rect: [20,10 86.359375x17.46875]
|
|
"left margin"
|
|
TextNode <#text>
|
|
BlockContainer <div.box> at (172,10) content-size 150x50 flex-item children: inline
|
|
line 0 width: 141.28125, height: 17.46875, bottom: 17.46875, baseline: 13.53125
|
|
frag 0 from TextNode start: 0, length: 18, rect: [172,10 141.28125x17.46875]
|
|
"follow immediately"
|
|
TextNode <#text>
|
|
BlockContainer <div.box> at (458,10) content-size 150x50 flex-item children: inline
|
|
line 0 width: 138.296875, height: 17.46875, bottom: 17.46875, baseline: 13.53125
|
|
frag 0 from TextNode start: 0, length: 17, rect: [458,10 138.296875x17.46875]
|
|
"over at the right"
|
|
TextNode <#text>
|
|
BlockContainer <(anonymous)> at (8,62) content-size 784x0 children: inline
|
|
TextNode <#text>
|