Details summary margin appears to be wrong

I checked that…

• … the documentation does not mention anything about my problem
• … the problem doesn’t occur with the default MkDocs template
• … the problem is not in any of my customizations (CSS, JS, template)
• … there are no open or closed issues that are related to my problem

Description

It appears the margin for summary is incorrect. It appears to use

.md-typeset summary {
    margin: 0 -0.6rem 0 -0.8rem;
}

But should use:

.md-typeset summary {
    margin: 0 -0.6rem 0 -0.6rem;
}

The problem doesn’t appear until you try to override the background color of the summary. The above change does not affect the visual appearance of the base style, which seems to suggest that it is a quirk due to when the style is applied.

To demonstrate that this is not related to my site’s custom styling, I’ve demonstrated that it occurs on Materials official docs with a simple CSS change:

I have replicated this on both Chrome and Firefox. I have not tried others yet.

Expected behavior

Changing the summary background should not make the left details border disappear.

Actual behavior

Summary background changes should not cause the left detail’s border to disappear.

Steps to reproduce the bug

See description

Package versions

• Python: 3.8
• MkDocs: Latest
• Material: 6.0

System information

• OS: macOS
• Browser: Firefox and Chrome, maybe more.

[facelessuser]

However, this does not work in Chrome due to a bug (which I just found out about)

Yeah, the quirks of different browsers 😬.

If nothing, this will make it more obvious what is happening. The user will have something they can see that is not getting styled.

[squidfunk]

Released as part of 6.1.0.