mirror of
https://github.com/LadybirdBrowser/ladybird.git
synced 2025-08-18 08:20:44 +00:00
LibWeb: Move z-index
to table wrapper box
When drawing a table, some of the CSS properties must be moved from the table grid box to an anonamyous table wrapper box. One of these properties is `position`. `z-index` however is not. This leads to the following behavior if a table has both `position` and `z-index`: * The wrapper box has the `position`, but a `z-index` of `auto`. * The grid box has the `z-index`, but `position: static`. This effectively means that the `z-index property is ignored since it has no effect on non-positioned elements. This behavior contradicts what other browsers do and causes layout issues on websites. To align Ladybird behavior with other browser this commit also moves the `z-index` property to the wrapper box.
This commit is contained in:
parent
91e4fb248b
commit
29d74632c7
Notes:
github-actions[bot]
2025-02-16 20:07:02 +00:00
Author: https://github.com/InvalidUsernameException
Commit: 29d74632c7
Pull-request: https://github.com/LadybirdBrowser/ladybird/pull/3595
Reviewed-by: https://github.com/kalenikaliaksandr ✅
4 changed files with 82 additions and 0 deletions
26
Tests/LibWeb/Ref/expected/tables-width-z-index-ref.html
Normal file
26
Tests/LibWeb/Ref/expected/tables-width-z-index-ref.html
Normal file
|
@ -0,0 +1,26 @@
|
|||
<!DOCTYPE html>
|
||||
<style>
|
||||
div {
|
||||
background-color: green;
|
||||
position: fixed;
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
}
|
||||
.offset-0 { top: 10px; }
|
||||
.offset-1 { top: 120px; }
|
||||
.offset-2 { top: 230px; }
|
||||
.offset-3 { top: 340px; }
|
||||
.offset-4 { top: 450px; }
|
||||
.offset-5 { top: 560px; }
|
||||
.offset-6 { top: 670px; }
|
||||
.offset-7 { top: 780px; }
|
||||
</style>
|
||||
|
||||
<div class="offset-0"></div>
|
||||
<div class="offset-1"></div>
|
||||
<div class="offset-2"></div>
|
||||
<div class="offset-3"></div>
|
||||
<div class="offset-4"></div>
|
||||
<div class="offset-5"></div>
|
||||
<div class="offset-6"></div>
|
||||
<div class="offset-7"></div>
|
Loading…
Add table
Add a link
Reference in a new issue