Подробности HTML/Стилизация маркера элемента сводки ⇐ CSS

[Anonymous]

У меня есть CSS, который стилизует маркер рядом с элементом сводки внутри элемента сведений. Сам CSS работает нормально. Однако, если я вложу еще один элемент сведений в первый (создавая родительский элемент сведений и дочерний элемент сведений), содержимое моего маркера не переключается должным образом. Как только я открываю родительский элемент, дочерний маркер отображается как открытый, даже если этот элемент еще не открыт.

Я не уверен, есть ли подходящий селектор для этого. в этом случае изолируйте дочерний элемент от родительского, поскольку дочерний элемент не открыт, а в CSS, насколько мне известно, нет [закрытого] синтаксиса. Похоже, что при вложении элементов деталей, как только родительский элемент открыт, все дочерние элементы также «открываются». Кто-нибудь раньше сталкивался с чем-то подобным?

Код: Выделить всё

summary {
outline: none;
font-size: 1.15em;
}

summary::-webkit-details-marker {
display: none
}

summary:after {
background: #da291c;
border-color: #da291c;
border-radius: 15px;
content: "+";
color: #fff;
float: left;
font-size: 1em;
font-weight: bold;
margin: -2px 10px 0 0;
padding: 1px 0 3px 0;
text-align: center;
width: 30px;
}

details[open] summary:after {
content: "-";
}

Код: Выделить всё

Parent

Parent Holder Text


Child

Child Holder Text

Подробнее здесь: https://stackoverflow.com/questions/488 ... er-styling