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

LibWeb: Improve align-items in abspos static position of flex child

Browse source 
Basically, just support more values. And add a test. :^)
This commit is contained in:
Andreas Kling 2023-07-04 14:57:41 +02:00 • committed by Jelle Raaijmakers
parent 80a734d42e
commit 793c2ff65a
3 changed files with 120 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

40
Tests/LibWeb/Layout/input/flex/abspos-flex-child-static-position-with-align-items.html Normal file
View file

@ -0,0 +1,40 @@
<!DOCTYPE html><style>
* {
border: 1px solid black !important;
}
body {
display: flex;
flex-wrap: wrap;
}
.outer {
display: flex;
width: 150px;
height: 150px;
background: wheat;
}
.outer > div {
position: absolute;
width: 150px;
height: 50px;
background: orange;
}
.normal { align-items: normal; }
.stretch { align-items: stretch; }
.flex-start { align-items: flex-start; }
.flex-end { align-items: flex-end; }
.start { align-items: start; }
.end { align-items: end; }
.center { align-items: center; }
.self-start { align-items: self-start; }
.self-end { align-items: self-end; }
</style>
<body>
<div class="outer normal"><div>normal</div></div>
<div class="outer stretch"><div>stretch</div></div>
<div class="outer start"><div>start</div></div>
<div class="outer flex-start"><div>flex-start</div></div>
<div class="outer end"><div>end</div></div>
<div class="outer flex-end"><div>flex-end</div></div>
<div class="outer center"><div>center</div></div>
<div class="outer self-start"><div>self-start</div></div>
<div class="outer self-end"><div>self-end</div></div>