Title: Different css for each "depth"?
Last modified: August 30, 2016

---

# Different css for each "depth"?

 *  Resolved [NatCornAdmin](https://wordpress.org/support/users/natcornadmin/)
 * (@natcornadmin)
 * [10 years, 6 months ago](https://wordpress.org/support/topic/different-css-for-each-depth/)
 * I have a list with a depth=2 that is working fine is it possible to have different
   style (css) for each of the depths so that depth 1 represents sub headings (h3)
   in the list and depth 2 is normal text as the individual list items.
 * I hope you understand what I am getting at.
 * Many thanks
 * [https://wordpress.org/plugins/cc-child-pages/](https://wordpress.org/plugins/cc-child-pages/)

Viewing 2 replies - 1 through 2 (of 2 total)

 *  Plugin Author [caterhamcomputing](https://wordpress.org/support/users/caterhamcomputing/)
 * (@caterhamcomputing)
 * [10 years, 6 months ago](https://wordpress.org/support/topic/different-css-for-each-depth/#post-6660753)
 * Sorry to have taken a while to respond, but I’ve not had been around much over
   the last couple of months … normal service is now resumed (hopefully)!
 * Because the widget and list mode use the `wp_list_pages` function built into 
   WordPress (see [https://codex.wordpress.org/Function_Reference/wp_list_pages](https://codex.wordpress.org/Function_Reference/wp_list_pages)),
   it would not easily be possible to make the list work as you describe. (It could
   be done, but would involve a lot of work in writing and testing a new walker 
   function … there is also the question of how far to take it … what happens if
   someone specifies a depth of 2,3 or 7!)
 * There is, however, a simple solution via CSS.
 * For example, you can specify the styling for top-level list items using:
 *     ```
       ul.ccchildpages_list li {
           font-size: 14pt;
           font-weight: bold;
       }
       ```
   
 * .. and the styling for sub-items in the list using:
 *     ```
       ul.ccchildpages_list li li {
           font-size: 10pt;
           font-weight: normal;
       }
       ```
   
 * … for further depths, you could add more:
 *     ```
       ul.ccchildpages_list li li {
           font-size: 8pt;
           color: #000066;
       }
       ```
   
 * I hope that this is of some help.
 * _[ [Signature moderated](http://codex.wordpress.org/Forum_Welcome#Signatures)]_
 *  Thread Starter [NatCornAdmin](https://wordpress.org/support/users/natcornadmin/)
 * (@natcornadmin)
 * [10 years, 6 months ago](https://wordpress.org/support/topic/different-css-for-each-depth/#post-6660754)
 * Thank you for your reply. I’ll try the solution you suggest.
 * Excellent support!
 * Thanks again

Viewing 2 replies - 1 through 2 (of 2 total)

The topic ‘Different css for each "depth"?’ is closed to new replies.

 * ![](https://ps.w.org/cc-child-pages/assets/icon-256x256.png?rev=3451096)
 * [CC Child Pages](https://wordpress.org/plugins/cc-child-pages/)
 * [Frequently Asked Questions](https://wordpress.org/plugins/cc-child-pages/#faq)
 * [Support Threads](https://wordpress.org/support/plugin/cc-child-pages/)
 * [Active Topics](https://wordpress.org/support/plugin/cc-child-pages/active/)
 * [Unresolved Topics](https://wordpress.org/support/plugin/cc-child-pages/unresolved/)
 * [Reviews](https://wordpress.org/support/plugin/cc-child-pages/reviews/)

## Tags

 * [css](https://wordpress.org/support/topic-tag/css/)
 * [list](https://wordpress.org/support/topic-tag/list/)

 * 2 replies
 * 2 participants
 * Last reply from: [NatCornAdmin](https://wordpress.org/support/users/natcornadmin/)
 * Last activity: [10 years, 6 months ago](https://wordpress.org/support/topic/different-css-for-each-depth/#post-6660754)
 * Status: resolved