LadybirdBrowser/ladybird
1
1
Fork 0
mirror of https://github.com/LadybirdBrowser/ladybird.git synced 2024-09-11 05:25:32 +03:00
Code Issues Packages Projects Releases Wiki Activity

LibWeb: Don't put abspos grid/flex items in anonymous wrapper

Browse Source 
Grid and flex containers have their own rules for abspos items, so we
shouldn't try to be clever and put them in the "current" anonymous
wrapper block. That behavior is primarily for the benefit of block &
inline layout.
This commit is contained in:
Andreas Kling 2023-04-06 18:01:01 +02:00
parent 8760376abe
commit 7b4c76788b
Notes: sideshowbarker 2024-07-17 07:43:44 +09:00 
Author: https://github.com/awesomekling
Commit: https://github.com/SerenityOS/serenity/commit/7b4c76788b
Pull-request: https://github.com/SerenityOS/serenity/pull/18208
3 changed files with 25 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
Tests/LibWeb/Layout/expected/flex-abspos-item-with-preceding-whitespace.txt Normal file
View File

@ -0,0 +1,7 @@
Viewport <#document> at (0,0) content-size 800x600 children: not-inline
BlockContainer <html> at (1,1) content-size 798x20 children: not-inline
BlockContainer <body> at (10,10) content-size 780x2 children: not-inline
Box <div.pink> at (11,11) content-size 778x0 flex-container(row) children: not-inline
BlockContainer <(anonymous)> at (11,11) content-size 0x0 children: inline
TextNode <#text>
BlockContainer <div.orange> at (11,-39) content-size 100x100 positioned children: not-inline

16
Tests/LibWeb/Layout/input/flex-abspos-item-with-preceding-whitespace.html Normal file
View File

@ -0,0 +1,16 @@
<!DOCTYPE html><html><head><style>
* {
border: 1px solid black !important;
}
.pink {
background: pink;
display: flex;
align-items: center;
}
.orange {
background: orange;
width: 100px;
height: 100px;
position: absolute;
}
</style></head><body><div class="pink"> <div class="orange">

2
Userland/Libraries/LibWeb/Layout/TreeBuilder.cpp
View File

@ -92,6 +92,8 @@ static Layout::Node& insertion_parent_for_block_node(Layout::NodeWithStyle& layo
bool is_out_of_flow = layout_node.is_absolutely_positioned() || layout_node.is_floating();
if (is_out_of_flow
&& !layout_parent.display().is_flex_inside()
&& !layout_parent.display().is_grid_inside()
&& layout_parent.last_child()->is_anonymous()
&& layout_parent.last_child()->children_are_inline()) {
// Block is out-of-flow & previous sibling was wrapped in an anonymous block.