mirrors/ladybird
0
0
Fork 0
mirror of https://github.com/LadybirdBrowser/ladybird.git synced 2025-08-08 17:19:13 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 9

LibWeb: Fix percentage insets resolution for grid items

Browse source 
compute_inset() was incorrectly retrieving the containing block size
because containing_block() is unaware of grid areas that form a
containing block for grid items but do not exist in the layout tree.
With this change, we explicitly pass the containing block into
compute_inset(), allowing it to correctly provide the containing block
sizes for grid items.
This commit is contained in:
Aliaksandr Kalenik 2024-11-11 15:54:21 +01:00 • committed by Andreas Kling
commit a8c1d12e84
Notes: github-actions[bot] 2024-11-11 19:21:44 +00:00
9 changed files with 102 additions and 12 deletions
Download patch file Download diff file Expand all files Collapse all files

33
Tests/LibWeb/Layout/input/grid/relative-position-grid-item-with-percentage-insets.html Normal file
View file

@ -0,0 +1,33 @@
<!DOCTYPE html>
<style>
.grid-container {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 10px;
width: 300px;
height: 300px;
border: 1px solid #ccc;
}
.grid-item {
display: flex;
align-items: center;
justify-content: center;
background-color: #eee;
border: 1px solid #aaa;
padding: 10px;
}
.relative-item {
position: relative;
left: 50%;
top: 50%;
background-color: #cce;
}
</style>
<div class="grid-container">
<div class="grid-item">Item 1</div>
<div class="grid-item relative-item">Item 2</div>
<div class="grid-item">Item 3</div>
<div class="grid-item">Item 4</div>
</div>