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

LibWeb: Don't use BFC auto height for non-BFC abspos elements

Browse source 
While CSS 2.2 does tell us to use the "auto height for BFC roots"
calculation when resolving auto heights for abspos elements, that
doesn't make sense for other formatting context roots, e.g flex.

In lieu of implementing the entire new absolute positioning model from
CSS-POSITION-3, this patch borrows one small nugget from it: using
fit-content height as the auto height for non-BFC-root abspos elements.
This commit is contained in:
Andreas Kling 2023-06-20 13:20:08 +02:00
parent 38a6b7ad3d
commit c808f6c637
4 changed files with 58 additions and 15 deletions
Download patch file Download diff file Expand all files Collapse all files

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

@ -0,0 +1,8 @@
Viewport <#document> at (0,0) content-size 800x600 children: not-inline
BlockContainer <html> at (1,1) content-size 798x0 [BFC] children: not-inline
Box <body> at (9,9) content-size 512.859375x19.46875 positioned flex-container(column) [FFC] children: not-inline
BlockContainer <div> at (10,10) content-size 510.859375x17.46875 flex-item [BFC] children: inline
line 0 width: 510.859375, height: 17.46875, bottom: 17.46875, baseline: 13.53125
frag 0 from TextNode start: 0, length: 60, rect: [10,10 510.859375x17.46875]
"Diese Website nutzt Cookies und vergleichbare Funktionen zur"
TextNode <#text>

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

@ -0,0 +1,20 @@
<!DOCTYPE html><style>
* {
border: 1px solid black;
}
html {
background: white;
}
body {
display: flex;
flex-flow: column nowrap;
position: absolute;
top: 0px;
left: 0px;
background: pink;
}
div {
min-height: 0px;
background: orange;
}
</style><body><div>Diese Website nutzt Cookies und vergleichbare Funktionen zur