RGBCube/serenity
1
Fork 0
mirror of https://github.com/RGBCube/serenity synced 2025-07-26 18:17:44 +00:00
Code Issues Activity Actions

LibWeb: Fix reverse flex layout with justify-content: normal

Browse source 
Before this change, we used the wrong insertion point for flex items
in reverse layouts with `justify-content: normal`. This caused flex
items to overflow the flex containers "backwards" from the start edge.
This commit is contained in:
Andreas Kling 2024-01-08 11:29:53 +01:00
parent 6480ed20b8
commit aa245f9f18
3 changed files with 42 additions and 4 deletions
Download patch file Download diff file Expand all files Collapse all files

23
Tests/LibWeb/Layout/input/flex/reverse-with-justify-content-normal.html Normal file
View file

@ -0,0 +1,23 @@
<!DOCTYPE html><style type="text/css">
* {
outline: 1px solid black;
}
.row {
flex-direction: row-reverse;
}
.column {
flex-direction: column-reverse;
}
.flex {
display: flex;
width: 200px;
height: 200px;
background: pink;
justify-content: normal;
}
.item {
width: 100px;
height: 100px;
background: orange;
}
</style><body><div class="flex row"><div class="item"></div></div><div class="flex column"><div class="item"></div></div>