RGBCube/serenity
1
Fork 0
mirror of https://github.com/RGBCube/serenity synced 2025-07-27 13:57:35 +00:00
Code Issues Activity Actions

LibWeb: Handle case where abspos flex child position depends on height

Browse source 
There's a particularly awkward case where the static position of an
abspos child of a flex container is dependent on its height. This can
happen when `align-items: center` is in effect, as we have to adjust
the abspos child's Y position by half of its height.

This patch solves the issue by reordering operations in the abspos
height resolution algorithm, to make sure that height is resolved
before the static position is calculated.
This commit is contained in:
Andreas Kling 2023-09-03 14:10:46 +02:00
parent f77256fcba
commit 50d72f0d8c
3 changed files with 57 additions and 13 deletions
Download patch file Download diff file Expand all files Collapse all files

12
Tests/LibWeb/Layout/expected/flex/abspos-flex-child-with-auto-height.txt Normal file
View file

@ -0,0 +1,12 @@
Viewport <#document> at (0,0) content-size 800x600 children: not-inline
BlockContainer <html> at (0,0) content-size 800x16 [BFC] children: not-inline
Box <body> at (8,8) content-size 784x0 positioned flex-container(row) [FFC] children: not-inline
BlockContainer <div.abspos> at (8,-42) content-size 100x100 positioned [BFC] children: not-inline
BlockContainer <div.green> at (8,-42) content-size 100x200 children: inline
TextNode <#text>
ViewportPaintable (Viewport<#document>) [0,0 800x600] overflow: [0,-42 800x642]
PaintableWithLines (BlockContainer<HTML>) [0,0 800x16] overflow: [0,-42 800x200]
PaintableBox (Box<BODY>) [8,8 784x0] overflow: [8,-42 100x200]
PaintableWithLines (BlockContainer<DIV>.abspos) [8,-42 100x100] overflow: [8,-42 100x200]
PaintableWithLines (BlockContainer<DIV>.green) [8,-42 100x200]