Vue version

3.3.4

Link to minimal reproduction

https://play.vuejs.org/#eNqNUk1PwzAM/StRJLQLtHzcRkECxAEOgIBjLl3itYE0iZJ0FE377zjp1n3AJk6N/WzX7/nN6Y212awFOqaF507aQDyE1l4zLRtrXCBz4mBKFmTqTENGWDoaoJfSgQ5LJMv7ME4bXTLNdJH3E3EWBgEaq8oAKSKkWDbnGBf5ANJjGjw3eiqr7MMbjXvNYzmj3DRWKnDPNkijPaNjkpCIlUqZr8eUC66F41We18A//8h/+C7mGH1x4MHNgNEBC6WrIPTw/dsTdPgewMaIVmH1AfAVvFFt3LEvu221wLU36tK2D0lCqat3f98F0H5FKi4aKxepnlGU8+4A9fW6F9lF6mN6gSre1VKJPZfdOs3mYQohZwS/cXR6c1V6f8Woh9LxmtHrIsd0Oln/3ToeBj58KyB4QQsC46xvjOtOjBPgxuTMdgQVkgJ9JdAnthQCZUDg1HYY1yCrOiCdcwwJ019ShDqip0eIIjvcPf4kWmXtuP3+TUIMHh1k+WXRLR36pl32yaz/ZxxVnJT8s3IGPXDCjTLIf6Ja2CGy+AG88DPO

Steps to reproduce

A Parent and Child component having a css class with the same name within their own scoped styles

The class in the child is not placed on the root node Class is passed by the parent to the child

// Parent.vue

<Child class="classname" />

What is expected?

The CSS from the parent should affect the child root node.

What is actually happening?

The child root node is affected by both the parent declaration as well as its own declaration

System Info

No response

Any additional comments?

No response

We are aware that this can be an issue, but it also has its advantages (i.e. positioning children etc easily) - also it's documented behavior that we can't change outside of a major release.

https://vuejs.org/api/sfc-css-features.html#child-component-root-elements