Viewing 12 posts - 1 through 12 (of 12 total)
  • Author
    Posts
  • August 10, 2018 at 8:04 pm #996138
    CodeSamurai

    Hi,

    I’m trying to change the navigational buttons on a LayerSlider. I was able to change the background color and the size of the buttons, but I’m not able to change the border color of the circle nor can I add more space between each circle. I need each navigational circle button to have space between each other.

    Do you know how I can add space and change the color of the border? I’m including a link to an example of what I have so far. Thanks!

    August 11, 2018 at 9:33 am #996238
    Rikard

    Hey CodeSamurai,

    Please try the following in Quick CSS under Enfold->General Styling:

    .ls-bottom-slidebuttons a {
  margin-right:5px;
  border:none !important;
}

    Best regards,
    Rikard

    August 11, 2018 at 5:47 pm #996314
    CodeSamurai

    Thanks, we are close. The spacing/margin worked, but the border did not. If you go back to my example you will see there is still a white border around the circle buttons. Any other ideas to get that border removed or have its color changed?

    Thanks again!

    August 12, 2018 at 9:25 pm #996498
    Basilis

    Hi,

    Please try:

    border: 0px !important;

    And let us know if it works.

    Best regards,
    Basilis

    August 12, 2018 at 9:31 pm #996501
    CodeSamurai

    Hi,

    Tried that as well and that doesn’t work. I actually just want to change the color of the border, not remove it. I can’t change anything relating to the border as it stands right now.

    How can I change the border color?

    Thanks!

    August 13, 2018 at 1:15 pm #996653
    Victoria

    Hi CodeSamurai,

    Can you disable CSS merging, please, so that we can see where the code is coming from?

    Best regards,
    Victoria

    August 13, 2018 at 1:19 pm #996658
    CodeSamurai

    Done, I disabled the merging as requested. Please let me know if there’s anything else you need.

    Thank you for looking into this!

    August 13, 2018 at 3:12 pm #996723
    Victoria

    Hi CodeSamurai,

    Thank you :)

    Here is the code you can put in Enfold > General Styling > Quick Css,  if it does not work, put into themes/enfold/css/custom.css

    
#top .avia-layerslider .ls-bottom-slidebuttons a {
  border: 2px solid #666 !important;
}

    If you need further assistance please let us know.

    Best regards,
    Victoria

    August 13, 2018 at 5:25 pm #996773
    CodeSamurai

    Perfect, that worked! Thank you very much for the help!

    August 14, 2018 at 6:24 am #996955
    Rikard

    Hi,

    Great, glad you got it working :-)

    Please let us know if you should need any further help on the topic or if we can close it.

    Best regards,
    Rikard

    August 14, 2018 at 1:42 pm #997074
    CodeSamurai

    This topic can be closed, I am all set. Thanks!

    August 14, 2018 at 8:50 pm #997280
    Jordan Shannon

    Hi,

    I’m glad you got this resolved. If you need additional help, please let us know here in the forums.

    Best regards,
    Jordan Shannon

  • Author
    Posts
Viewing 12 posts - 1 through 12 (of 12 total)
  • The topic ‘Layerslider Navigational Buttons CSS Assistance’ is closed to new replies.