Css select href внутри родного брата li не работает [закрыто] ⇐ Html

[Anonymous]

I'm using a ol list with href and css selectors. I can style the ol list without href links and it's working ok see codepen [this link][1]

[the following should be cross marked]
Now if I insert href links, style does not apply, see [codepen link][2] like
[the previous should be cross marked after comment about invalid html as I was using h3 element as a precedent of a li element, thanks for this remark @Paulie_D]

So by getting things together, I find something simple that seem to work (reaching href inside li) and tested on [this codepen][3]. Please review

the html below



/*

*/

* {
box-sizing: border-box;
margin: 0;
padding: 0;
}

/* default */
a:link {
text-decoration: none;
color: grey;
}

a:visited {
text-decoration: none;
color: grey;
}

a:hover {
text-decoration: underline;
color: grey;
}

a:active {
text-decoration: none;
color: grey;
}

div.card1 {
margin: 2rem 8rem;
}

h3 {
padding: 1rem;
}

ol {
list-style-type: none;
color: lightgrey
}

ol li {
font-size: 150%;
color: firebrick;
}

ol ol {
margin-left: 0%;
margin-bottom: 0.75%;
color: blue;
}

ol ol li,
ol ol li a:link {
line-height: 1.5;
font-size: 100%;
font-weight: bold;
color: darkblue;
color: lime;
}

ol ol li {
margin-left: 3%;
}

ol ol ol {
margin-left: 2%;
}

ol ol ol li {
font-weight: normal;
color: indigo;
}

• ol li Title PART 1
• ol ol li title part 1 1
• ol ol ol li title part 1 1 1
• ol ol ol li title part 1 1 2
• ol ol ol li title part 1 1 3
• ol ol ol li title part 1 1 4

• ol ol li title part 2 1
• ol ol ol li title part 1 2 1
• ol ol ol li title part 1 2 2
• ol ol ol li title part 1 2 3

• ol li Title PART 2
• ol ol li title part 2 1
• ol ol ol li title part 2 1 1
• ol ol ol li title part 2 1 2
• ol ol ol li title part 2 1 3
• ol ol ol li title part 2 1 4

• ol ol li title part 2 2
• ol ol ol li title part 2 2 1
• ol ol ol li title part 2 2 2
• ol ol ol li title part 2 2 3

• ol li Title PART 3
• ol ol li title part 3 1
• ol ol ol li title part 3 1 1
• ol ol ol li title part 3 1 2
• ol ol ol li title part 3 1 3
• ol ol ol li title part 3 1 4

Комментарии помогли найти это решение и предыдущий ответ, хотя он казался вводящим в заблуждение, я вернусь и проголосую за него.
Я думаю, что у меня есть действительный HTML, иначе, пожалуйста, сообщите, опять же, где это возможно, я предпочитаю не использовать классы, точнее, стиль выполняется внутри div.card1, поэтому я могу просто использовать div.card1, чтобы список всегда отображал то же
[1]: https://codepen.io/barpasc/pen/emJagRG
[2]: https://codepen.io/barpasc/pen/LEGoWLE
[3]: https://codepen.io/barpasc/pen/ogbRZwX


Подробнее здесь: https://stackoverflow.com/questions/798 ... ot-working