WordPress.org

1. bobbem
   Member
   Posted 3 years ago #

   I've looked through the Codex pages dealing with child categories (esp. Styling with CSS), but still cannot get my site to diplay correctly. Any help will be greatly appreciated!

   I would like my subcategories to be indented when displayed in the sidebar. I would like them to look something like this:

   Theory
   __Political Theory
   __Sociology
   __etc.

   My categories function call looks like this:

   <?php wp_list_cats('sort_column=name&hide_empty=0&hierarchical=1&optioncount=1');?>

   In the style.css I've tried all of the following, to no avail:

   #subcontent ul.categories ul li a {margin-left: 20px};
   #subcontent ul.children li a {margin-left: 20px};
   #subcontent ul ul li a {margin-left: 20px};
   #subcontent ul ul li {margin-left: 20px};
   .children li a {margin-left: 20px};
   and a bunch of other combinations.

   Thanks again for any help!

2. davedotcom
   Member
   Posted 3 years ago #

   I would try the following:

   1. In your sidebar.php file change <ul class='children'> to <ul class="children">. I actually don't think this will do anything, but just in case.

   2. Try these styles...

   In your layout.css file, where it reads:

   #subcontent ul.categories li ul ul {margin:0 0 0 16px;}

   Change to:

   #subcontent ul.categories li ul li {margin:0 0 0 16px;}

   If you're still having problems then I would take all of your padding and margin styles out of the ul and li elements and put them in their respective a elements.

   So...

   
#subcontent ul li {
margin:2px 0 2px 18px;
padding-bottom:2px;
border-bottom:1px solid;
}
#subcontent li a {
display:block;
padding:1px 0;
height:1%; /* IE WIN */
}


   Becomes...

   #subcontent ul li {
border-bottom:1px solid;
}
#subcontent li a {
display:block;
padding:1px 0 2px 0;
margin:2px 0 2px 18px;
height:1%; /* IE WIN */
}


   Let me know if this works.

3. bobbem
   Member
   Posted 3 years ago #

   Davedotcom,

   This worked:

   Change to:

   #subcontent ul.categories li ul li {margin:0 0 0 16px;}

   Thanks so much! Pheew...

Topic Closed

This topic has been closed to new replies.