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

LibWeb: Position abspos items inside grid relative to their grid area

Browse source 
Since grid item's containing block is not grid container but
corresponding grid area, it affect positioning of abspos items.
This commit is contained in:
Aliaksandr Kalenik 2023-10-30 21:52:13 +01:00 • committed by Andreas Kling
parent 44001d2178
commit 141f56accc
3 changed files with 91 additions and 2 deletions
Download patch file Download diff file Expand all files Collapse all files

23
Tests/LibWeb/Layout/input/grid/abspos-item-with-grid-area.html Normal file
View file

@ -0,0 +1,23 @@
<!DOCTYPE html><style>
* {
border: 1px solid black;
}
.grid {
display: grid;
grid-template-columns: 100px 100px;
grid-template-areas: "a b";
position: relative;
width: 200px;
height: 100px;
}
.abspos-item {
position: absolute;
top: 0;
left: 0;
width: 50px;
height: 50px;
grid-area: b;
}
</style><div class="grid"><div class="abspos-item"></div></div>