не срабатывает псевдокласс :not(:first-child)

Question

Есть простая структура с дочерними p. Не срабатывает псевдокласс :not(:first-child). Когда из данного контейнера убираю тег img, то все работает. Непонятно, почему не срабатывает, ведь обращение вот такое - .header_feedback_block_tel p:not(:first-child).

.header_feedback_block_tel p {
  font-style: normal;
  font-weight: normal;
  font-size: 18px;
  line-height: 23px;
}

.header_feedback_block_tel p:not(:first-child) {
   font-weight: bold;
}

<div class="header_feedback_block_tel">
  <img src="">
  <p>1</p>
  <p>2</p>
  <p>3</p>
</div>

Answer 1

Потому, что первый потомок (:first-child) у вас это как раз <img>, а первого потомка p не существует. Чтобы срабатывало на определённый тег используйте :first-of-type :

.header_feedback_block_tel p {
  font-style: normal;
  font-weight: normal;
  font-size: 18px;
  line-height: 23px;
}

.header_feedback_block_tel p:not(:first-of-type) {
  font-weight: bold;
}

<div class="header_feedback_block_tel">
  <img src="">
  <p>1</p>
  <p>2</p>
  <p>3</p>
</div>

Answer 2

Во-первых, первым у тебя был img, а не p; а во-вторых, можно вообще заменить на плюс:

.header_feedback_block_tel p {
  font-style: normal;
  font-weight: normal;
  font-size: 18px;
  line-height: 23px;
}

.header_feedback_block_tel p + p {
   font-weight: bold;
}

<div class="header_feedback_block_tel">
  <img src="">
  <p>1</p>
  <p>2</p>
  <p>3</p>
</div>

БЛОГ НА HUSL

не срабатывает псевдокласс :not(:first-child)

Ответы (2 шт):