RGBCube/serenity
1
Fork 0
mirror of https://github.com/RGBCube/serenity synced 2025-10-31 05:32:44 +00:00
Code Issues Activity Actions

LibWeb: Account for all clipped border radii in containing block chain

Browse source 
With this change, instead of applying only the border-radius clipping
from the closest containing block with hidden overflow, we now collect
all boxes within the containing block chain and apply the clipping from
all of them.
This commit is contained in:
Aliaksandr Kalenik 2024-02-10 17:52:57 +01:00 • committed by Andreas Kling
parent 1ae416fa94
commit d4932196cc
9 changed files with 133 additions and 32 deletions
Download patch file Download diff file Expand all files Collapse all files

30
Tests/LibWeb/Ref/nested-boxes-with-hidden-overflow-and-border-radius.html Normal file
View file

@ -0,0 +1,30 @@
<!DOCTYPE html>
<link rel="match" href="reference/nested-boxes-with-hidden-overflow-and-border-radius-ref.html" />
<style>
.outer {
overflow: hidden;
border-radius: 100px;
background-color: magenta;
width: 500px;
height: 500px;
}
.middle {
overflow: hidden;
border-radius: 50px;
transform: translate(10px, 10px);
background-color: lawngreen;
}
.inner {
width: 100px;
height: 100px;
background-color: black;
transform: translate(10px, 10px);
}
</style>
<div class="outer">
<div class="middle">
<div class="inner"></div>
</div>
</div>