Control appearance of BG img in a sub-category icon via CSS/LESS?



  • At CSS level - is it possible instigate display:none on the BG-image of the sub-category icon but not affect the larger primary larger Categories icon on the main categories level page?

    On quick look it appears the bg-img url is in the span tag - is it possible to have it over-ridden by placing display:none in the primary controlling class and if so what is exactly is that class for the sub-category icon exactly?



  • Ok ok - this seems to work so far for me.

    .fa-lg[style*="url(/assets/uploads/category/category-1.png)"] {
        background-image: none !important;
    }
    


  • I'd appreciate if someone could guide me here - I'm not having success controlling the look of the a category sub-category icon on the Categories page - it's inheriting the changes I've made to the following classes below that I've used these to control the icon on the categories page to my liking:

    .categories>li .content .icon, .category>ul>li .content
    

    However those also affect the sub-category icon, looking at the code this is what I'm now trying to control or I think I need to control but I think it conflict with the top level Category icon:

    <div class="icon pull-left" style="background-color: #86C1B9; color: #333;">.

    This is where I've found it:

    <span class="category-children-item pull-left">**<div class="icon pull-left" style="background-color: #86C1B9; color: #333;">**<i class="fa fa-fw fa-comments"></i></div><a href="/category/5/sub-category-test"><small>Sub-Category-Test</small></a></span>
    

    I'm trying to change the shape and size of the sub-category icon, right now it's the same size as it's top level Category.

    Also of course there could be a syntax error or conflict in my CSS hacks also causing it and I'll play more and look closer also.



  • Well this seemed to work for me -

    .categories>li .category-children .icon, .category>ul>li .category-children .icon 
    

    Now on to control the layout of the sub categories !!!!! 🙂


Log in to reply
 

Suggested Topics

  • 6
  • 6
  • 8
  • 14
  • 13
| |