Как выделить элемент родительского списка без выделения элементов списка детей?

Question

У меня возникают проблемы со списком ссылок, который я генерирую с помощью Wordpress, который отображает конкретную ссылку на страницу, а также все ссылки на дочерние страницы. Я пытаюсь, чтобы ссылки были выделены при наведении на них, а затем, когда вы нажимаете на них и переходите к странице, ссылка этой страницы остается выделенной. Я нашел способ добиться этого в основном с помощью:

#sidebar a:hover{ 
    padding: 7px; 
    background-color: #f7f9fe; 
    color: #728186; 
} 
#sidebar ul > li .current_page_item{ 
    padding: 7px; 
    background-color: #f7f9fe; 
    color: #728186; 
} 

но это не позволяет мне выделить родительскую страницу/li. Если я использую:

#sidebar li.current_page_item 

ребенок остается подсвеченной на своей странице, но на родительской странице также подчеркивает дочерний элемент, а не только сам по себе.

вот мой разобран PHP:

<ul id="sidebar" class="sidelist"> 
    <li class="pagenav"><h5>WHAT WE DO</h5> 
     <ul> 
      <li class="page_item page-item-39 current_page_item"><a href="http://www.autismrecoveryfoundation.org/meet-the-board" title="Meet the Board">Meet the Board</a> 
      <ul class='children'> 
       <li class="page_item page-item-84"><a href="http://www.autismrecoveryfoundation.org/meet-the-board/being-a-board-member-101" title="Being A Board Member 101">Being A Board Member 101</a></li> 
      </ul> 
      </li> 
     </ul> 
    </li> 
</ul> 

Вот шаблон тег Я использую со страницы Wordpress о списке сора страницах (http://codex.wordpress.org/Function_Reference/wp_list_pages):

<?php 
      // use wp_list_pages to display parent and all child pages all generations (a tree with parent) 
      $parent = 39; 
      $args=array(
      'title_li' => '', 
      'child_of' => $parent 
      ); 
      $pages = get_pages($args); 
      if ($pages) { 
       $pageids = array(); 
       foreach ($pages as $page) { 
       $pageids[]= $page->ID; 
       } 

       $args=array(
       'title_li' => '<h5>WHAT WE DO</h5>', 
       'include' => $parent . ',' . implode(",", $pageids) 
      ); 
       wp_list_pages($args); 
      } 
     ?> 

Answer 1

Update

для отображения списка страниц в виде плоского списка, установите depth -1:

$args=array(
    'depth' => -1, 
    'title_li' => '<h5>WHAT WE DO</h5>', 
    'include' => $parent . ',' . implode(",", $pageids) 
); 

Таким образом, вам не придется возиться с детьми селекторов, и ваши подстраниц не будет содержаться в вашей главной страницы-х li больше.

---

Старый ответ

Проблема заключается в этом селекторе:

#sidebar ul > li .current_page_item 

#sidebar ul часть ищет ul, который нисходит из #sidebar, но в коде ulявляется#sidebar. Кроме того, li .current_page_item найдет любое.current_page_item внутри li, которое содержит ваш заголовок.

Измените селектор на это:

#sidebar > li > ul > .current_page_item 

Вы также можете использовать это, так как ваши страницы виджет имеет свой собственный класс в любом случае:

.pagenav > ul > .current_page_item