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

LibWeb: Compute inset for relative positioned inline-block

Browse source
This commit is contained in:
Emil Militzer 2023-04-28 11:44:21 +02:00 • committed by Andreas Kling
parent 62bc8590ad
commit a8d08357c9
3 changed files with 31 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

16
Tests/LibWeb/Layout/expected/block-and-inline/inline-box-positioned-with-top-left.txt Normal file
View file

@ -0,0 +1,16 @@
Viewport <#document> at (0,0) content-size 800x600 children: not-inline
BlockContainer <html> at (0,0) content-size 800x36 children: not-inline
BlockContainer <body> at (8,8) content-size 784x20 children: inline
line 0 width: 352.34375, height: 20, bottom: 20, baseline: 13.53125
frag 0 from TextNode start: 0, length: 14, rect: [8,8 112.421875x17.46875]
"text text text"
frag 1 from BlockContainer start: 0, length: 0, rect: [120,8 110.375x20]
frag 2 from TextNode start: 0, length: 16, rect: [231,8 129.546875x17.46875]
"more inline text"
TextNode <#text>
BlockContainer <span.displaced_text> at (150,48) content-size 110.375x20 positioned inline-block children: inline
line 0 width: 110.375, height: 17.46875, bottom: 17.46875, baseline: 13.53125
frag 0 from TextNode start: 0, length: 14, rect: [150,48 110.375x17.46875]
"displaced text"
TextNode <#text>
TextNode <#text>

14
Tests/LibWeb/Layout/input/block-and-inline/inline-box-positioned-with-top-left.html Normal file
View file

@ -0,0 +1,14 @@
<style>
body {
font-family: 'SerenitySans';
}
.displaced_text {
height: 20px;
top: 40px;
left: 30px;
display: inline-block;
position: relative;
}
</style>text text text<span class="displaced_text">displaced text</span>more inline text

1
Userland/Libraries/LibWeb/Layout/InlineFormattingContext.cpp
View file

@ -256,6 +256,7 @@ void InlineFormattingContext::generate_line_boxes(LayoutMode layout_mode)
break; break;
case InlineLevelIterator::Item::Type::Element: { case InlineLevelIterator::Item::Type::Element: {
auto& box = verify_cast<Layout::Box>(*item.node); auto& box = verify_cast<Layout::Box>(*item.node);
compute_inset(box);
line_builder.break_if_needed(item.border_box_width()); line_builder.break_if_needed(item.border_box_width());
line_builder.append_box(box, item.border_start + item.padding_start, item.padding_end + item.border_end, item.margin_start, item.margin_end); line_builder.append_box(box, item.border_start + item.padding_start, item.padding_end + item.border_end, item.margin_start, item.margin_end);
break; break;