diff --git a/Tests/LibWeb/Layout/expected/flex/flex-basis-intrinsic-sizing-keywords.txt b/Tests/LibWeb/Layout/expected/flex/flex-basis-intrinsic-sizing-keywords.txt new file mode 100644 index 00000000000..54d8ec2379c --- /dev/null +++ b/Tests/LibWeb/Layout/expected/flex/flex-basis-intrinsic-sizing-keywords.txt @@ -0,0 +1,39 @@ +Viewport <#document> at (0,0) content-size 800x600 children: not-inline + BlockContainer at (0,0) content-size 800x67 [BFC] children: not-inline + Box at (8,8) content-size 784x51 flex-container(row) [FFC] children: not-inline + BlockContainer at (8,8) content-size 27.640625x51 flex-item [BFC] children: inline + frag 0 from TextNode start: 0, length: 3, rect: [8,8 27.15625x17] baseline: 13.296875 + "foo" + frag 1 from TextNode start: 4, length: 3, rect: [8,25 27.640625x17] baseline: 13.296875 + "bar" + frag 2 from TextNode start: 8, length: 3, rect: [8,42 27.203125x17] baseline: 13.296875 + "baz" + TextNode <#text> + BlockContainer at (35.640625,8) content-size 98x51 flex-item [BFC] children: inline + frag 0 from TextNode start: 0, length: 11, rect: [35.640625,8 98x17] baseline: 13.296875 + "foo bar baz" + TextNode <#text> + BlockContainer at (133.640625,8) content-size 98x51 flex-item [BFC] children: inline + frag 0 from TextNode start: 0, length: 11, rect: [133.640625,8 98x17] baseline: 13.296875 + "foo bar baz" + TextNode <#text> + BlockContainer at (231.640625,8) content-size 0x51 flex-item [BFC] children: inline + frag 0 from TextNode start: 0, length: 3, rect: [231.640625,8 27.15625x17] baseline: 13.296875 + "foo" + frag 1 from TextNode start: 4, length: 3, rect: [231.640625,25 27.640625x17] baseline: 13.296875 + "bar" + frag 2 from TextNode start: 8, length: 3, rect: [231.640625,42 27.203125x17] baseline: 13.296875 + "baz" + TextNode <#text> + +ViewportPaintable (Viewport<#document>) [0,0 800x600] + PaintableWithLines (BlockContainer) [0,0 800x67] + PaintableBox (Box) [8,8 784x51] + PaintableWithLines (BlockContainer
.min-content) [8,8 27.640625x51] + TextPaintable (TextNode<#text>) + PaintableWithLines (BlockContainer
.max-content) [35.640625,8 98x51] + TextPaintable (TextNode<#text>) + PaintableWithLines (BlockContainer
.fit-content) [133.640625,8 98x51] + TextPaintable (TextNode<#text>) + PaintableWithLines (BlockContainer
.auto) [231.640625,8 0x51] overflow: [231.640625,8 27.640625x51] + TextPaintable (TextNode<#text>) diff --git a/Tests/LibWeb/Layout/input/flex/flex-basis-intrinsic-sizing-keywords.html b/Tests/LibWeb/Layout/input/flex/flex-basis-intrinsic-sizing-keywords.html new file mode 100644 index 00000000000..79220a4232a --- /dev/null +++ b/Tests/LibWeb/Layout/input/flex/flex-basis-intrinsic-sizing-keywords.html @@ -0,0 +1,9 @@ +
foo bar baz
foo bar baz
foo bar baz
foo bar baz
\ No newline at end of file diff --git a/Userland/Libraries/LibWeb/CSS/Properties.json b/Userland/Libraries/LibWeb/CSS/Properties.json index bdb51f6678b..a21cf642c37 100644 --- a/Userland/Libraries/LibWeb/CSS/Properties.json +++ b/Userland/Libraries/LibWeb/CSS/Properties.json @@ -889,7 +889,10 @@ ], "valid-identifiers": [ "auto", - "content" + "content", + "fit-content", + "max-content", + "min-content" ], "percentages-resolve-to": "length" }, diff --git a/Userland/Libraries/LibWeb/Layout/FlexFormattingContext.cpp b/Userland/Libraries/LibWeb/Layout/FlexFormattingContext.cpp index d7b40be447a..b9d92a0987e 100644 --- a/Userland/Libraries/LibWeb/Layout/FlexFormattingContext.cpp +++ b/Userland/Libraries/LibWeb/Layout/FlexFormattingContext.cpp @@ -603,6 +603,15 @@ void FlexFormattingContext::determine_flex_base_size_and_hypothetical_main_size( // in this calculation use fit-content as the flex item’s cross size. // The flex base size is the item’s resulting main size. + if (auto* size = item.used_flex_basis->get_pointer()) { + if (size->is_fit_content()) + return calculate_fit_content_main_size(item); + if (size->is_max_content()) + return calculate_max_content_main_size(item); + if (size->is_min_content()) + return calculate_min_content_main_size(item); + } + // NOTE: If the flex item has a definite main size, just use that as the flex base size. if (has_definite_main_size(item)) return inner_main_size(item);