Skip to content

Add missing values for CSS mask-border-* properties - #30655

Merged
caugner merged 2 commits into
mdn:mainfrom
Elchi3:mask-border-sub-features
Sep 24, 2026
Merged

caugner merged 2 commits into
mdn:mainfrom
Elchi3:mask-border-sub-features

Conversation

@Elchi3

@Elchi3 Elchi3 commented Sep 24, 2026

Copy link
Copy Markdown
Member

Summary

Add missing sub-features.

Test results and supporting details

Data taken from existing features on the short-hands, or from initial support of the long-hand properties.

Related issues

Missed in #28138. This is the last one needs filling from what I can tell!

The remaining properties that are still TBD require solving the context question, see #30613.

@github-actions github-actions Bot added the data:css Compatibility data for CSS features. https://developer.mozilla.org/docs/Web/CSS label Sep 24, 2026
@github-actions github-actions Bot added the size:l Pull request changing 101-1,000 lines of code. label Sep 24, 2026
@github-actions

github-actions Bot commented Sep 24, 2026 •

Copy link
Copy Markdown
Contributor

Tip: Review these changes grouped by change (recommended for most PRs), or grouped by feature (for large PRs).

@Elchi3
Elchi3 force-pushed the mask-border-sub-features branch from ad6a87e to 72d2f0c Compare September 24, 2026 10:51
@Elchi3 Elchi3 changed the title Add missing values for CSS properties Add missing values for CSS mask-border-* properties Sep 24, 2026

@caugner caugner left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

It looks like Chromium also supports -webkit-mask-box-image/-webkit-mask-box-image-repeat: round/space/stretch!

console.table(["repeat", "round", "space", "stretch"].map((value) => ({
    value,
    longhand: CSS.supports("-webkit-mask-box-image-repeat", value),
    shorthand: CSS.supports("-webkit-mask-box-image", `url("image.png") ${value}`),
  })));

yields

[
    {
        "value": "repeat",
        "longhand": true,
        "shorthand": true
    },
    {
        "value": "round",
        "longhand": true,
        "shorthand": true
    },
    {
        "value": "space",
        "longhand": true,
        "shorthand": true
    },
    {
        "value": "stretch",
        "longhand": true,
        "shorthand": true
    }
]

@caugner caugner left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Sorry, previous should have been "Request changes", not "Approve".

@Elchi3

Elchi3 commented Sep 24, 2026 •

Copy link
Copy Markdown
Member Author

Thanks, this was marked as false in the collector because it doesn't take into account the -webkit-mask-box-image alternative name.

@Elchi3
Elchi3 requested a review from caugner September 24, 2026 12:05
@caugner

caugner commented Sep 24, 2026

Copy link
Copy Markdown
Contributor

Thanks!

@caugner
caugner merged commit 81a0d98 into mdn:main Sep 24, 2026
10 checks passed
@Elchi3
Elchi3 deleted the mask-border-sub-features branch September 24, 2026 12:22
@mdn-bot mdn-bot mentioned this pull request Sep 24, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

data:css Compatibility data for CSS features. https://developer.mozilla.org/docs/Web/CSS size:l Pull request changing 101-1,000 lines of code.

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants