Viewing 10 posts - 1 through 10 (of 10 total)
  • Author
    Posts
  • January 21, 2018 at 11:16 am #900328
    Ghallab

    Hi,
    I am using the default separator for all headers but i notice that some separator have a length more than required like the below link sample
    Regards,

    January 21, 2018 at 6:43 pm #900419
    Nikko

    Hey Ghallab,

    Can you tell us what you want to achieve? a screenshot would help.

    Best regards,
    Nikko

    January 22, 2018 at 10:44 am #900730
    Ghallab

    Hi Nikko,
    As you see in screen shot the length of separator more than required it must be suitable for the width of word
    https://prnt.sc/i3taxh
    check that screen shoot
    Regards,
    Ghallab

    January 23, 2018 at 5:32 am #901158
    Nikko

    Hi,

    The separator doesn’t have that feature (underlines does that), however we can help you with it, though it needs to be manually changed, just add this css code in Quick CSS (located in Enfold > General Styling):

    .page-id-23 .hr-short.hr-left.avia-builder-el-4 .hr-inner {
    width: 130px;
}

.page-id-1207 .hr-short.hr-center.avia-builder-el-2 .hr-inner {
    width: 160px;
    margin-left: -80px;
}

    This would affect the 2 links you gave above.

    Best regards,
    Nikko

    January 23, 2018 at 1:10 pm #901425
    Ghallab

    Hi Nikko
    Thank you for you support it’s working great
    what about home page link below
    Regards,
    Ghallab

    January 23, 2018 at 6:01 pm #901589
    Nikko

    Hi Ghallab,

    You’re welcome :) Try adding this css code:

    .home .hr-short.hr-center .hr-inner {
    width: 160px;
    margin-left: -80px;
}

    Best regards,
    Nikko

    January 23, 2018 at 7:30 pm #901627
    Guenni007

    or you define a custom hr – there you can choose the width of the hr
    choose thin and your desired width of the hr.
    Choose no icon for it.
    And give a custom class to the hr: “customised-hr”

    do this to quick css:

    .customised-hr .hr-inner.inner-border-av-border-thin::before {
    content: "○";
    font-size: 24px;
    position: relative;
    left: 0;
    top: -15px;
    color: #e1e1e1;;
    background-color: #fff;
}

.customised-hr .hr-inner.inner-border-av-border-thin {
    border-top-width: 2px;
}

    The color of the before content must concern to your hr color you set

    see here: https://webers-testseite.de/3images-one-link/

    big advantage : make one template of the custom hr and if you need it insert it and only fit the width for it

    January 24, 2018 at 7:15 am #901961
    Rikard

    Hi,

    Thanks for sharing @guenni007, much appreciated :-)

    Best regards,
    Rikard

    January 24, 2018 at 3:40 pm #902190
    Ghallab

    It’s working great.
    thank you everyone for supporting me

    January 24, 2018 at 8:25 pm #902292
    Nikko

    Hi,

    Glad to hear that. Thanks for using Enfold :)

    Best regards,
    Nikko

  • Author
    Posts
Viewing 10 posts - 1 through 10 (of 10 total)
  • The topic ‘Separator’ is closed to new replies.