interactive-examples icon indicating copy to clipboard operation
interactive-examples copied to clipboard

Bad practise in examples (prefixed property last)

Open 1jj opened this issue 1 year ago • 4 comments

MDN URL

https://developer.mozilla.org/en-US/docs/Web/CSS/box-decoration-break

What specific section or headline is this issue about?

Try it

What information was incorrect, unhelpful, or incomplete?

An example of bad practice:

box-decoration-break: slice;
-webkit-box-decoration-break: slice;

Prefixed property last

What did you expect to see?

-webkit-box-decoration-break: slice;
box-decoration-break: slice;

Prefixed property first

Do you have any supporting links, references, or citations?

No response

Do you have anything more you want to share?

No response

MDN metadata

Page report details
  • Folder: en-us/web/css/box-decoration-break
  • MDN URL: https://developer.mozilla.org/en-US/docs/Web/CSS/box-decoration-break
  • GitHub URL: https://github.com/mdn/content/blob/main/files/en-us/web/css/box-decoration-break/index.md
  • Last commit: https://github.com/mdn/content/commit/2adfb8760ac42c80966080e2e84211b14e43b589
  • Document last modified: 2023-07-18T00:15:42.000Z

1jj avatar Jun 27 '24 12:06 1jj

What's the difference?

Josh-Cena avatar Jun 27 '24 12:06 Josh-Cena

It looks like this is your first issue. Welcome! 👋 One of the project maintainers will be with you as soon as possible. We appreciate your patience. To safeguard the health of the project, please take a moment to read our code of conduct.

github-actions[bot] avatar Jun 27 '24 12:06 github-actions[bot]

What's the difference?

There could be a difference in future (depending on implementation details)[1], but thats not the point. It's just an undisputed priciple. https://developer.mozilla.org/en-US/docs/Glossary/Vendor_Prefix#css_prefixes https://css-tricks.com/ordering-css3-properties/ https://bitsofco.de/css-vendor-prefixes/#how-do-we-use-them https://stackoverflow.com/questions/7080605/ordering-of-vendor-specific-css-declarations https://webhint.io/docs/user-guide/hints/hint-css-prefix-order/#what-does-the-hint-check

[1] if they keep their prefixed-property non-standardish and fix it only for the unprefixed version. We have seen this before. https://groups.google.com/a/chromium.org/g/blink-dev/c/PyIR0yUMYsM

(I see ... you seem to be a fairly young person, means less experience with CSS Prefix Hell :-)

1jj avatar Jun 28 '24 02:06 1jj

I see. Not only am I inexperienced with Prefix Hell, I'm also generally inexperienced with CSS ;)

Josh-Cena avatar Jun 28 '24 03:06 Josh-Cena