mirror of
https://github.com/RGBCube/serenity
synced 2025-05-15 17:04:59 +00:00
5484062095
In cases where the stacking context painting requires a separate bitmap, the destination position needs to be translated by the scrolling offset to ensure it ends up in the correct position.
52 lines
1.2 KiB
HTML
52 lines
1.2 KiB
HTML
<!DOCTYPE html>
|
|
<style>
|
|
html {
|
|
background: white;
|
|
}
|
|
body {
|
|
position: absolute;
|
|
inset: 0px;
|
|
display: flex;
|
|
background: pink;
|
|
}
|
|
#outer {
|
|
overflow: hidden;
|
|
background: orange;
|
|
margin-top: 100px;
|
|
}
|
|
#inner {
|
|
height: 1000px;
|
|
background: yellow;
|
|
}
|
|
.item {
|
|
box-sizing: border-box;
|
|
border: 1px solid black;
|
|
background: lime;
|
|
height: 50px;
|
|
width: 200px;
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
opacity: 0.5;
|
|
}
|
|
</style><body><div id="outer"><div id="inner">
|
|
<div class="item">11</div>
|
|
<div class="item">12</div>
|
|
<div class="item">13</div>
|
|
<div class="item">14</div>
|
|
<div class="item">15</div>
|
|
<div class="item">16</div>
|
|
<div class="item">17</div>
|
|
<div class="item">18</div>
|
|
<div class="item">19</div>
|
|
<div class="item">20</div>
|
|
<div class="item">21</div>
|
|
<div class="item">22</div>
|
|
<div class="item">23</div>
|
|
<div class="item">24</div>
|
|
<div class="item">25</div>
|
|
<div class="item">26</div>
|
|
<div class="item">27</div>
|
|
<div class="item">28</div>
|
|
<div class="item">29</div>
|
|
<div class="item">30</div>
|