system/serenity
system/serenity
1
0
Fork 0
mirror of https://github.com/SerenityOS/serenity synced 2024-09-06 17:06:31 +00:00
Code Issues Packages Projects Releases Wiki Activity

LibWeb: Use the margin box of floating elements for flowing around

Browse source 
Inline content flows around the entire margin box of floating elements,
not just the content box.
This commit is contained in:
Andreas Kling 2020-12-12 19:58:23 +01:00
parent 66e9dde86f
commit 2b8c7faee4
3 changed files with 35 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

17
Base/res/html/misc/float-2.html Normal file
View file

@ -0,0 +1,17 @@
<!DOCTYPE html>
<html>
<head>
<style>
#b {
border: 1px solid red;
width: 50px;
height: 50px;
float: left;
}
</style>
</head>
<body>
<div id=b></div>
<div id=a>Text</div>
</body>
</html>

16
Libraries/LibWeb/Layout/Box.h
View file

@ -58,6 +58,22 @@ public:
return width() + border_box.left + border_box.right;
}
Gfx::FloatRect content_box_as_relative_rect() const
{
return { m_offset, m_size };
}
Gfx::FloatRect margin_box_as_relative_rect() const
{
auto rect = content_box_as_relative_rect();
auto margin_box = box_model().margin_box(*this);
rect.set_x(rect.x() - margin_box.left);
rect.set_width(rect.width() + margin_box.left + margin_box.right);
rect.set_y(rect.y() - margin_box.top);
rect.set_height(rect.height() + margin_box.top + margin_box.bottom);
return rect;
}
float absolute_x() const { return absolute_rect().x(); }
float absolute_y() const { return absolute_rect().y(); }
Gfx::FloatPoint absolute_position() const { return absolute_rect().location(); }

4
Libraries/LibWeb/Layout/InlineFormattingContext.cpp
View file

@ -62,7 +62,7 @@ static AvailableSpaceForLineInfo available_space_for_line(const InlineFormatting
for (ssize_t i = bfc.left_floating_boxes().size() - 1; i >= 0; --i) {
auto& floating_box = *bfc.left_floating_boxes().at(i);
Gfx::FloatRect rect { floating_box.effective_offset(), floating_box.size() };
auto rect = floating_box.margin_box_as_relative_rect();
if (rect.contains_vertically(y)) {
info.left = rect.right() + 1;
break;
@ -73,7 +73,7 @@ static AvailableSpaceForLineInfo available_space_for_line(const InlineFormatting
for (ssize_t i = bfc.right_floating_boxes().size() - 1; i >= 0; --i) {
auto& floating_box = *bfc.right_floating_boxes().at(i);
Gfx::FloatRect rect { floating_box.effective_offset(), floating_box.size() };
auto rect = floating_box.margin_box_as_relative_rect();
if (rect.contains_vertically(y)) {
info.right = rect.left() - 1;
break;