RGBCube/serenity
1
Fork 0
mirror of https://github.com/RGBCube/serenity synced 2025-07-26 21:47:46 +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

18
Tests/LibWeb/Layout/input/flex/abspos-flex-child-with-auto-height.html Normal file
View file

@ -0,0 +1,18 @@
<!DOCTYPE html><style>
* { outline: black solid 1px; }
body {
position: relative;
display: flex;
align-items: center;
}
.abspos {
position: absolute;
max-height: 100px;
}
.green {
display: block;
width: 100px;
height: 200px;
background: green;
}
</style><body><div class="abspos"><div class="green">