Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
    Posts
  • #520285

    The Enfold forum enabled me to customize colors for the ALB Accordion element successfully. Because I have so many items, I would like to increase the readability by styling it with alternate row background colors.
    How might the CSS look?

    Here is the code I’m using thus far…

    .main_color .toggler {
    background: #f1f1f1;
    color: #666666;
    }
    
    .main_color .toggler:hover {
    color: #666;
    background: #c1ccc1;
    }
    
    .toggler, .main_color .toggler.activeTitle {
    background: #c1ccc1;
    color: #666;
    }
    
    .main_color .toggle_content {
    background: white;
    }
    .toggle_icon .vert_icon, .toggle_icon .hor_icon, span.toggle_icon {
    border-color: #FFF;
    }
    .main_color .toggler, .main_color .toggler.activeTitle:hover {
    background: #c1ccc1 !important;
    color: #666 !important;
    }
    
    #520741

    Hi Julie!

    Thank you for using Enfold.

    Use the nth-child selector. Something like this:

    .main_color .av_toggle_section:nth-child(even) .toggler {
        background: red !important;
    }

    Regards,
    Ismael

    #520936

    Oh beautiful Enfold accordion alternating style :) Gracias!
    Please close this ticket.

Viewing 3 posts - 1 through 3 (of 3 total)
  • The topic ‘Enfold Accordian – alternate background color’ is closed to new replies.