mirror of
https://github.com/RGBCube/serenity
synced 2025-07-26 04:17:34 +00:00
LibWeb: Use correct reference for abspos elements with % height sizes
Absolutely positioned elements should have their percentage sizes resolved against the padding box of the containing block, not the content box. From CSS-POSITION-3 <https://www.w3.org/TR/css-position-3/#def-cb> "..the containing block is formed by the padding edge of the ancestor.."
This commit is contained in:
parent
357174d8fd
commit
c374541711
3 changed files with 20 additions and 2 deletions
|
@ -0,0 +1,4 @@
|
||||||
|
Viewport <#document> at (0,0) content-size 800x600 children: not-inline
|
||||||
|
BlockContainer <html> at (0,0) content-size 800x256 [BFC] children: not-inline
|
||||||
|
BlockContainer <body> at (8,248) content-size 784x0 positioned children: not-inline
|
||||||
|
BlockContainer <div.abspos> at (8,8) content-size 784x240 positioned [BFC] children: not-inline
|
|
@ -0,0 +1,14 @@
|
||||||
|
<!DOCTYPE html><style>
|
||||||
|
body {
|
||||||
|
position: relative;
|
||||||
|
padding-top: 30%;
|
||||||
|
}
|
||||||
|
.abspos {
|
||||||
|
position: absolute;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
top: 0px;
|
||||||
|
left: 0px;
|
||||||
|
background: orange;
|
||||||
|
}
|
||||||
|
</style><body><div class="abspos">
|
|
@ -1390,9 +1390,9 @@ CSS::Length FormattingContext::calculate_inner_width(Layout::Box const& box, Ava
|
||||||
return width.resolved(box, width_of_containing_block_as_length_for_resolve);
|
return width.resolved(box, width_of_containing_block_as_length_for_resolve);
|
||||||
}
|
}
|
||||||
|
|
||||||
CSS::Length FormattingContext::calculate_inner_height(Layout::Box const& box, AvailableSize const&, CSS::Size const& height) const
|
CSS::Length FormattingContext::calculate_inner_height(Layout::Box const& box, AvailableSize const& available_height, CSS::Size const& height) const
|
||||||
{
|
{
|
||||||
auto height_of_containing_block = m_state.get(*box.non_anonymous_containing_block()).content_height();
|
auto height_of_containing_block = available_height.to_px();
|
||||||
auto height_of_containing_block_as_length_for_resolve = CSS::Length::make_px(height_of_containing_block);
|
auto height_of_containing_block_as_length_for_resolve = CSS::Length::make_px(height_of_containing_block);
|
||||||
if (height.is_auto()) {
|
if (height.is_auto()) {
|
||||||
return height.resolved(box, height_of_containing_block_as_length_for_resolve);
|
return height.resolved(box, height_of_containing_block_as_length_for_resolve);
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue