Close the current-cat li before the children

[betsyk]

In a hierarchical category list, children adopt the current-cat class from parents. This is due to the Walker_Category structure which nests <ul class='children'> inside the <li> of the parent list. The parent list should be closed before the child <ul> begins.

Let's say I have a list of categories:

<ul><?php wp_list_categories('style=list&hierarchical=1&depth=0'); ?></ul>

And I want to style the current category:

.current-cat {
background-color: #cccccc;
}

The HTML output is this:

<ul><li class="cat-item cat-item-21 current-cat"><a href="​http://mysite/category/food/cookies">cookies</a>
<ul class='children'><li class="cat-item cat-item-107"><a href="​http://mysite/category/food/cookies/oatmeal">oatmeal</a></li></ul></li></ul>

It should be this:

<ul><li class="cat-item cat-item-21 current-cat"><a href="​http://mysite/category/food/cookies">cookies</a></li><ul class='children'><li class="cat-item cat-item-107"><a href="​http://mysite/category/food/cookies/oatmeal">oatmeal</a></li></ul></ul>

Didn't see anything related in the open tickets - hopefully this isn't a duplicate bug report.

[betsyk]

changes are commented and prefixed with FIX

[dd32]

<ul>
  <li>
   has-children
  </li>
  <ul>
   <li> children..

like you suggest is invalid nested HTML.

The current form is the correct method for nested lists:

<ul>
 <li>
   has-children
   <ul>
     <li> children..

You can probably achieve what you want by having the child ul 100% width, and setting a padding on it instead of a margin, as a result, the background colour of the parent would be hidden behind the background colour of the child ul.

Closing as invalid due to the premise being the HTML is incorrect.

[dd32]

just reverting that description change.. Didn't mean to add it to the final comment.