Category Sections - Separate UL/LI styling

3 posts by 3 authors in: Forums > CMS Builder
Last Post: April 23, 2009   (RSS)

Hi Everyone,
I'm not sure if anyone has managed to do this yet but i'm having real trouble styling the Category Sections. I've used the code provided by Dave for an Unordered List as posted here:
http://www.interactivetools.com/iforum/P64259

I am working on a test site here:
http://www.salonproductsonline.co.uk/treatmentsdetail.php?Facials-1

I have tried using a class for just general UL/LI code but it doesn't work. It just uses the same image/style option for all items.

I need the Main Headings, eg. Facials, Body, Gentlemen, etc....to stand out and be styled differently from the sub-menu items. I have tried so many different variations but nothing seems to work! [crazy]

Does anyone have any ideas at all? Or has anyone else done this so i can see how they have got it to work?

Thanks in advance.
Nikki

Re: [nikkijones] Category Sections - Separate UL/LI styling

By Deborah - April 23, 2009

Hi, nikkijones.

I think you'll need to add another class to your CSS. You currently have styling for:
#LeftColumn A:link
#Left Column A:visited
#LeftColumn A:hover
#treatments ul
#treatments li

But I don't see anything for:
#treatments ul ul (which defines your sub-level list)

Apply separate styling for the top-level and sub-level in your style sheet by defining values for the following:

#treatments ul
#treatments ul li
#treatments ul li a

#treatments ul ul
#treatments ul ul li
#treatments ul ul li a

Be sure to override any styling you don't want in the second level that is in the first level, otherwise that style will be inherited.

Hope that makes sense.
~ Deborah