css.properties.contain.style - Safari behaves differently than Firefox/Chromium

What type of issue is this?

Browser bug (a bug with a feature that may impact site compatibility)

What information was incorrect, unhelpful, or incomplete?

Based on the documentation and example for the CSS contain property with a value of style, it appears no browser supports this feature as it is documented.

According to the contain compatibility list on MDN, the CSS contain: style property/value is supported in Chromium, Firefox, and Safari. The page includes an example of a 5-item list using a CSS counter, with the 3rd item using contain: style. The documentation explains that contain:style on the 3rd item would cause the CSS counter to begin again at 1.

Browsers do not order the list this way, nor do they order the list consistently.

• Firefox and Chromium browser(s) count 1, 2, 1, 3, 4.
• WebKit browser(s) count 1, 2, 3, 4, 5.

Related Question: Based on the documentation, should all browsers render as Firefox and Chromium? Or should the counter reset affect sibling elements, so that the counter order is 1, 2, 1, 2, 3?

If we adjust the example to move the check out from the exact list item using contain: style and into a child <div>, this inconsistency is not corrected. In fact, no browser agrees, and the browsers almost appear to disagree with themselves.

• Chromium browser(s) now count 1, 2, 0, 4, 5.
• Firefox browser(s) now count 1, 2, 3, 4, 5.
• WebKit browser(s) now count 1, 2, 0, 1, 2.

Related Question: Based on the documentation, should all browsers render as Firefox and Chromium did in the first example? Or should the counter reset affect sibling elements, so that the counter order would be 1, 2, 1, 2, 3? Or something else?

CSS contain property references:

• Link to the MDN compatibility table
• Link to the MDN example.
• Link to [the adjusted MDN example](https://cdpn.io/pen/debug/gOjgoKj.

What browsers does this problem apply to, if applicable?

Chromium (Chrome, Edge 79+, Opera, Samsung Internet), Firefox, Safari

What did you expect to see?

I’m unsure. Based on the documentation, I most expected a result that no browser demonstrated.

Did you test this? If so, how?

See provided links

Can you link to any release notes, bugs, pull requests, or MDN pages related to this?

No response

Do you have anything more you want to share?

No response

MDN URL

https://developer.mozilla.org/en-US/docs/Web/CSS/contain#browser_compatibility

MDN metadata

No response

Start with the MDN contain compatibility table and its style-containment counter example, then reproduce both provided examples in Chromium, Firefox, and WebKit browsers. Determine the expected counter behavior from the CSS specification and whether the compatibility data or example is incorrect; done means documenting a supported conclusion and updating the relevant compatibility entry if warranted.