When you add `container-type` to an element in CSS, it implicitly applies style containment, which scopes CSS counters. This means descendants can no longer access `counter-reset` defined on the container or outside it. The result is that `counter-increment` inside the container creates a new isolated counter per element instead of sharing one, causing unexpected behavior. The fix is either to move `counter-reset` onto the container element itself or to move `counter-increment` to the actual elements rather than pseudo-elements. The same issue applies when using `contain: style`, `strict`, or `content`.

2m read timeFrom css-tip.com
Post cover image

Sort: