diff --git a/Tests/LibWeb/Layout/expected/block-and-inline/block-with-max-content-width.txt b/Tests/LibWeb/Layout/expected/block-and-inline/block-with-max-content-width.txt new file mode 100644 index 0000000000..7149aac729 --- /dev/null +++ b/Tests/LibWeb/Layout/expected/block-and-inline/block-with-max-content-width.txt @@ -0,0 +1,24 @@ +Viewport <#document> at (0,0) content-size 800x600 children: not-inline + BlockContainer at (1,1) content-size 798x76.40625 [BFC] children: not-inline + BlockContainer at (10,10) content-size 780x58.40625 children: not-inline + BlockContainer at (11,11) content-size 150.21875x17.46875 children: inline + line 0 width: 150.21875, height: 17.46875, bottom: 17.46875, baseline: 13.53125 + frag 0 from TextNode start: 0, length: 18, rect: [11,11 150.21875x17.46875] + "width: max-content" + TextNode <#text> + BlockContainer <(anonymous)> at (10,29.46875) content-size 780x0 children: inline + TextNode <#text> + BlockContainer at (11,30.46875) content-size 187.953125x17.46875 children: inline + line 0 width: 187.953125, height: 17.46875, bottom: 17.46875, baseline: 13.53125 + frag 0 from TextNode start: 0, length: 22, rect: [11,30.46875 187.953125x17.46875] + "max-width: max-content" + TextNode <#text> + BlockContainer <(anonymous)> at (10,48.9375) content-size 780x0 children: inline + TextNode <#text> + BlockContainer at (11,49.9375) content-size 183.078125x17.46875 children: inline + line 0 width: 183.078125, height: 17.46875, bottom: 17.46875, baseline: 13.53125 + frag 0 from TextNode start: 0, length: 22, rect: [11,49.9375 183.078125x17.46875] + "min-width: max-content" + TextNode <#text> + BlockContainer <(anonymous)> at (10,68.40625) content-size 780x0 children: inline + TextNode <#text> diff --git a/Tests/LibWeb/Layout/input/block-and-inline/block-with-max-content-width.html b/Tests/LibWeb/Layout/input/block-and-inline/block-with-max-content-width.html new file mode 100644 index 0000000000..0ed4128b58 --- /dev/null +++ b/Tests/LibWeb/Layout/input/block-and-inline/block-with-max-content-width.html @@ -0,0 +1,22 @@ + +
width: max-content
+
max-width: max-content
+
min-width: max-content
diff --git a/Userland/Libraries/LibWeb/CSS/Properties.json b/Userland/Libraries/LibWeb/CSS/Properties.json index 42bd632c05..cfff90b15c 100644 --- a/Userland/Libraries/LibWeb/CSS/Properties.json +++ b/Userland/Libraries/LibWeb/CSS/Properties.json @@ -1338,6 +1338,7 @@ ], "valid-identifiers": [ "fit-content", + "max-content", "none" ], "quirks": [ @@ -1374,6 +1375,7 @@ "valid-identifiers": [ "auto", "fit-content", + "max-content", "none" ], "quirks": [ @@ -1773,7 +1775,8 @@ ], "valid-identifiers": [ "auto", - "fit-content" + "fit-content", + "max-content" ], "quirks": [ "unitless-length" diff --git a/Userland/Libraries/LibWeb/Layout/FormattingContext.cpp b/Userland/Libraries/LibWeb/Layout/FormattingContext.cpp index b9f5a5deef..18b02f18f2 100644 --- a/Userland/Libraries/LibWeb/Layout/FormattingContext.cpp +++ b/Userland/Libraries/LibWeb/Layout/FormattingContext.cpp @@ -1349,6 +1349,9 @@ CSS::Length FormattingContext::calculate_inner_width(Layout::Box const& box, Ava if (width.is_fit_content()) { return CSS::Length::make_px(calculate_fit_content_width(box, AvailableSpace { available_width, AvailableSize::make_indefinite() })); } + if (width.is_max_content()) { + return CSS::Length::make_px(calculate_max_content_width(box)); + } auto& computed_values = box.computed_values(); if (computed_values.box_sizing() == CSS::BoxSizing::BorderBox) {