diff --git a/Tests/LibWeb/Layout/expected/block-and-inline/margin-padding-block-inline-start.txt b/Tests/LibWeb/Layout/expected/block-and-inline/margin-padding-block-inline-start.txt new file mode 100644 index 0000000000..1be82a2787 --- /dev/null +++ b/Tests/LibWeb/Layout/expected/block-and-inline/margin-padding-block-inline-start.txt @@ -0,0 +1,10 @@ +Viewport <#document> at (0,0) content-size 800x600 children: not-inline + BlockContainer at (1,1) content-size 798x99.46875 [BFC] children: not-inline + BlockContainer at (10,10) content-size 500x81.46875 children: not-inline + BlockContainer at (51,21) content-size 413x49.46875 children: not-inline + BlockContainer at (92,32) content-size 326x17.46875 children: inline + line 0 width: 41.78125, height: 17.46875, bottom: 17.46875, baseline: 13.53125 + frag 0 from TextNode start: 0, length: 5, rect: [93,32 39.78125x17.46875] + "Hello" + InlineNode + TextNode <#text> diff --git a/Tests/LibWeb/Layout/input/block-and-inline/margin-padding-block-inline-start.html b/Tests/LibWeb/Layout/input/block-and-inline/margin-padding-block-inline-start.html new file mode 100644 index 0000000000..cf10efb205 --- /dev/null +++ b/Tests/LibWeb/Layout/input/block-and-inline/margin-padding-block-inline-start.html @@ -0,0 +1,29 @@ +
Hello \ No newline at end of file diff --git a/Userland/Libraries/LibWeb/CSS/Properties.json b/Userland/Libraries/LibWeb/CSS/Properties.json index 5c29a68b26..016d76245c 100644 --- a/Userland/Libraries/LibWeb/CSS/Properties.json +++ b/Userland/Libraries/LibWeb/CSS/Properties.json @@ -1265,6 +1265,22 @@ "unitless-length" ] }, + "margin-block-start": { + "logical-alias-for": [ + "margin-top", + "margin-right", + "margin-bottom", + "margin-left" + ] + }, + "margin-block-end": { + "logical-alias-for": [ + "margin-top", + "margin-right", + "margin-bottom", + "margin-left" + ] + }, "margin-bottom": { "inherited": false, "initial": "0", @@ -1279,6 +1295,22 @@ "unitless-length" ] }, + "margin-inline-start": { + "logical-alias-for": [ + "margin-top", + "margin-right", + "margin-bottom", + "margin-left" + ] + }, + "margin-inline-end": { + "logical-alias-for": [ + "margin-top", + "margin-right", + "margin-bottom", + "margin-left" + ] + }, "margin-left": { "inherited": false, "initial": "0", @@ -1503,6 +1535,22 @@ "unitless-length" ] }, + "padding-block-start": { + "logical-alias-for": [ + "padding-top", + "padding-right", + "padding-bottom", + "padding-left" + ] + }, + "padding-block-end": { + "logical-alias-for": [ + "padding-top", + "padding-right", + "padding-bottom", + "padding-left" + ] + }, "padding-bottom": { "inherited": false, "initial": "0", @@ -1514,6 +1562,22 @@ "unitless-length" ] }, + "padding-inline-start": { + "logical-alias-for": [ + "padding-top", + "padding-right", + "padding-bottom", + "padding-left" + ] + }, + "padding-inline-end": { + "logical-alias-for": [ + "padding-top", + "padding-right", + "padding-bottom", + "padding-left" + ] + }, "padding-left": { "inherited": false, "initial": "0", diff --git a/Userland/Libraries/LibWeb/CSS/StyleComputer.cpp b/Userland/Libraries/LibWeb/CSS/StyleComputer.cpp index 20cd281dbb..f7573a668a 100644 --- a/Userland/Libraries/LibWeb/CSS/StyleComputer.cpp +++ b/Userland/Libraries/LibWeb/CSS/StyleComputer.cpp @@ -283,6 +283,34 @@ static bool contains(Edge a, Edge b) static void set_property_expanding_shorthands(StyleProperties& style, CSS::PropertyID property_id, StyleValue const& value, DOM::Document& document, CSS::CSSStyleDeclaration const* declaration) { + auto map_logical_property_to_real_property = [](PropertyID property_id) -> Optional { + // FIXME: Honor writing-mode, direction and text-orientation. + switch (property_id) { + case PropertyID::MarginBlockStart: + return PropertyID::MarginTop; + case PropertyID::MarginBlockEnd: + return PropertyID::MarginBottom; + case PropertyID::MarginInlineStart: + return PropertyID::MarginLeft; + case PropertyID::MarginInlineEnd: + return PropertyID::MarginRight; + case PropertyID::PaddingBlockStart: + return PropertyID::PaddingTop; + case PropertyID::PaddingBlockEnd: + return PropertyID::PaddingBottom; + case PropertyID::PaddingInlineStart: + return PropertyID::PaddingLeft; + case PropertyID::PaddingInlineEnd: + return PropertyID::PaddingRight; + default: + return {}; + } + }; + + auto real_property_id = map_logical_property_to_real_property(property_id); + if (real_property_id.has_value()) + return set_property_expanding_shorthands(style, real_property_id.value(), value, document, declaration); + if (value.is_composite()) { auto& composite_value = value.as_composite(); auto& properties = composite_value.sub_properties();