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

LibWeb: Use parent and sibling positions for absolutely positioned div

Browse source 
If absolutely positioned divs do not have a fixed position, then their
position must be calculated based off of the position of their parent
and their siblings.
This commit is contained in:
martinfalisse 2022-08-10 19:21:29 +02:00 • committed by Andreas Kling
parent 65e7126c48
commit 872b6369c4
1 changed files with 15 additions and 2 deletions
Download patch file Download diff file Expand all files Collapse all files

17
Userland/Libraries/LibWeb/Layout/FormattingContext.cpp
View file

@ -754,6 +754,16 @@ void FormattingContext::layout_absolutely_positioned_element(Box const& box)
Gfx::FloatPoint used_offset; Gfx::FloatPoint used_offset;
auto* relevant_parent = box.first_ancestor_of_type<Layout::BlockContainer>();
while (relevant_parent != nullptr) {
if (!relevant_parent->is_absolutely_positioned() && !relevant_parent->is_floating()) {
break;
} else {
relevant_parent = relevant_parent->first_ancestor_of_type<Layout::BlockContainer>();
}
}
auto parent_location = absolute_content_rect(static_cast<Box const&>(*relevant_parent), m_state);
if (!box.computed_values().inset().left.is_auto()) { if (!box.computed_values().inset().left.is_auto()) {
float x_offset = box_state.inset_left float x_offset = box_state.inset_left
+ box_state.border_box_left(); + box_state.border_box_left();
@ -764,7 +774,8 @@ void FormattingContext::layout_absolutely_positioned_element(Box const& box)
- box_state.border_box_right(); - box_state.border_box_right();
used_offset.set_x(width_of_containing_block + x_offset - box_state.content_width() - box_state.margin_right); used_offset.set_x(width_of_containing_block + x_offset - box_state.content_width() - box_state.margin_right);
} else { } else {
float x_offset = box_state.margin_box_left(); float x_offset = box_state.margin_box_left()
+ (relevant_parent->computed_values().position() == CSS::Position::Relative ? 0 : parent_location.x());
used_offset.set_x(x_offset); used_offset.set_x(x_offset);
} }
@ -778,7 +789,9 @@ void FormattingContext::layout_absolutely_positioned_element(Box const& box)
- box_state.border_box_bottom(); - box_state.border_box_bottom();
used_offset.set_y(height_of_containing_block + y_offset - box_state.content_height() - box_state.margin_bottom); used_offset.set_y(height_of_containing_block + y_offset - box_state.content_height() - box_state.margin_bottom);
} else { } else {
float y_offset = box_state.margin_box_top(); float y_offset = box_state.margin_box_top()
+ compute_box_y_position_with_respect_to_siblings(box, box_state)
+ (relevant_parent->computed_values().position() == CSS::Position::Relative ? 0 : parent_location.y());
used_offset.set_y(y_offset); used_offset.set_y(y_offset);
} }