Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • June 14, 2018 at 6:09 pm #972948
    fkm

    Hi, Enfold support team.

    I´m using the accordion toggle at my website and I´d like to match the line spacing.
    I already tried to handle it by myself but I failed.
    So please let me know how to reduce the vertical space at the opened and closed toggles as well as the space around the icons (+/–) on the left.

    Thanks in advance.

    Best regards, FKM

    June 15, 2018 at 6:02 am #973098
    Mike

    Hey FKMZ2,
    For the vertical toggle space, Try this code in the General Styling > Quick CSS field:

    .togglecontainer .toggle_wrap.active_tc .toggle_content {
padding-top: 0px !important; 
padding-bottom: 0px !important;
}
.togglecontainer .toggle_wrap.active_tc .toggle_content p {
margin-top: 0px !important; 
margin-bottom: 0px !important;
}

    For the space around the icons (+/–) on the left, Try this code in the General Styling > Quick CSS field:

    .js_active .toggler {
    padding-left: 25px !important; 
}

    Please adjust to suit.

    Best regards,
    Mike

    June 18, 2018 at 12:12 pm #974188
    fkm

    Hi, Mike.

    Thank you very much for your reply and codes.

    Please let me know how to reduce the line height even more (please see “accordion-01.jpg” at the link below) and also how to fit the spaces as seen on “accordion-02.jpg”?

    Thanks in advance.

    Best regards, FKM

    June 18, 2018 at 1:57 pm #974251
    Mike

    Hi,
    Thank you for the screenshots, Try this code in the General Styling > Quick CSS field:

    #top.home .togglecontainer .toggler {
    padding: 0px 3px 0px 35px !important; 
}
#top.home .togglecontainer .toggle_content {
    padding: 0px 0px 0px 35px !important; 
    margin-bottom: 0px !important; 
}
#top.home .togglecontainer .single_toggle {
    margin-bottom: 0px !important; 
}

    Best regards,
    Mike

    June 18, 2018 at 3:46 pm #974327
    fkm

    Hi, Mike,

    on point – thank you so much.

    Is there a simple way to move the text of the openend and closed toggles a lil bit more to the left to bring it closer to the icons (+/–)?

    Thanks in advance and best regards,
    FKM

    June 19, 2018 at 1:59 am #974562
    Mike

    Hi,
    You can adjust the “35px” to a smaller number, in the rules above, such as “10px”
    Thee first rule is for the heading, and the second is for the content.

    Best regards,
    Mike

    June 19, 2018 at 9:37 am #974658
    fkm

    Hi, Mike.

    Awww, I see, I just could have changed the value – I was too hasty, sorry.
    It works – great!

    Mission: complete.
    Thank you so much.

    Best regards, FKM

    June 19, 2018 at 9:44 am #974659
    Nikko

    Hi FkmZ2,

    Glad that Mike helped you. Thank you for using Enfold.

    Best regards,
    Nikko

  • Author
    Posts
Viewing 8 posts - 1 through 8 (of 8 total)
  • The topic ‘How to reduce space at the accordion toggle’ is closed to new replies.