Как воспользоваться селектором nth-child?

Question

[Secret73]

Подскажите как через селектор nth-child обратиться к ul который после заголовка

<div class="catContainer topCategory">
  <div class="container_12 hideInMobile">
    <div class="grid_12 ">
      <ul class="catalog">
        <li class=" node">
          <a href="">Заголовок</a><i></i>
          <ul class="">
            <li><a href="">Категория2</a></li>
            <li><a href="">Категория1</a></li>
          </ul>
        </li>
      </ul>
    </div>
  </div>
</div>

Comments

[iBird Rose]

он там единственный. в чем проблема обратиться сразу через .node ul {..} ?

[Secret73]

iBird Rose: Спасибо разобрался

Answer 1

[Александр]

зачем nth-child ?

.grid_12 > ul {
   // бла бла
}

Comments

[Roman Zhidkov]

Наверное .node > ul ?

[Александр]

Roman Zhidkov: не, оба не правы вот так
.node a~ul {
background: #888
}

[Roman Zhidkov]

Ну а если хочется через nth-child, то как-то так: .node: nth-child(1)

[Roman Zhidkov]

Упс, ошибочка - .node >ul : nth-child(1)

[Secret73]

Всем спасибо. Сделал. Нужно было именно через : nth-child(1) т.к. нужнобыло задать 4 элементам разный отступ

Answer 2

[Сергей Горячев]

Для начала нужно внимательно изучить, что такое nth-child ( 1, 2 и, конечно, 3 )
Упростить использование его поможет вот такой калькулятор nth-calculator.com
А в данном случае, простое наследование .node > ul решает проблему.