Добавьте стиль для второго потомка div с известным классом

Question

<a href="" class="header-logolink">

    <div>
        <img class="header-logoimage" src="~/images/SummerFling-logo.jpeg" alt="Summer Fling"/>
    </div>
    <div>
        <h1 class="header-logotext">Summer Fling</h1>
    </div>

</a>

Как я могу добавить отдельные стили к 2 <div> здесь без добавления классов к <div>?

Я пробовал использовать:

.header-logolink:nth-child(1) {

}

Но это влияет на стиль <a> вместо первого <div>, как показано здесь.

Answer 1

Вы выбираете якорный тег с n-м элементом, вам нужно выбрать div и затем указать n-й элемент, как показано ниже

.header-logolink div:nth-child(1) {
  background-color:red;
}

.header-logolink div:nth-child(2) {
  background-color:green;
}

Answer 2

Попробуйте сделать это для первого ребенка div

.header-logolink div:nth-child(1) {
  background-color: yellow;
}