RGBCube/serenity
1
Fork 0
mirror of https://github.com/RGBCube/serenity synced 2025-07-27 12:57:35 +00:00
Code Issues Activity Actions

LibWeb: Allow block level boxes to be floated and have clearance

Browse source 
Before, we completely ignored clearance for block-level boxes if they
were floated. This was incorrect because it is valid for a block-level
box to be floated and still have clearance. However, unlike clearance
on normal flow boxes, clearance on floating boxes does not affect the
y-position of subsequent normal flow boxes. Instead, it pushes the
box's position to the very beginning of an edge.

Work towards https://github.com/SerenityOS/serenity/issues/21023
This commit is contained in:
Aliaksandr Kalenik 2023-09-11 20:45:18 +02:00 • committed by Andreas Kling
parent 9240233378
commit 81ddad3fcf
3 changed files with 72 additions and 2 deletions
Download patch file Download diff file Expand all files Collapse all files

27
Tests/LibWeb/Layout/input/block-and-inline/block-level-floating-box-with-clearance.html Normal file
View file

@ -0,0 +1,27 @@
<!DOCTYPE html><style>
* { outline: 1px solid black; }
body { width: 600px; }
div {
width: 100px;
height: 100px;
}
#top {
float: left;
background: green;
}
#left {
float: left;
background: pink;
clear: both;
}
#right {
float: left;
background: orange;
}
.normal {
width: 300px;
height: 300px;
background-color: gray;
border: 10px solid sandybrown;
}
</style><body><div class="normal"></div><div id="top">top</div><div id="left">left</div><div id="right">right</div><div class="normal"></div><div class="normal"></div>