Issue with Button Borders

Hey normally I just custom CSS my button border colors since there is no default option to do so but for some reason, I can’t change the border colors on these two buttons.


It’s the two buttons at the top that say “READ ARTICLES” AND “SUBSCRIBE”

I’m trying to change the border colors to be black. I know the CSS and I’ve done this plenty of times not sure why its not working now though. Any help is much appreciated, thank you!

Hi Seth,

The Button module does include an option to edit the border. First you need to select a background color. Once you have done that, select transparent and you should be able to use the background color to control the border color.


Also, I can see the CSS you have added for the first button. However, I am not seeing any custom CSS for the second button. What CSS was you using?


yes, I see that, but when I do that, I can no longer make the button background color black on the hover…

Hey Seth,

Did you want those buttons to have a solid background on hover? If so, can you check the KB article below and see if it helps?


ben this worked thank you

Hi Seth,

Happy to hear your issue has been resolved and thanks for informing us. We appreciate it.


Hi - I want a transparent button to have a solid background on hover, and I have followed the instructions above, and put the following code into custom css in Dynamik, with the class color-hover in the button, row and column! But nothing will make that button go black on hover - any suggestions? I have cleared endless caches and turned caching off on the site.

.fl-builder-content .color-hover a.fl-button:hover {
background: #000000;
border: 2px solid #000000; /Border width must be the same with the Button module/

I will post the site in a separate reply set to private if you would like me to - Thanks - Robin

the issue is: .color-hover is the class of the button. when youre playing with the button settings in beaverbuilder, change the class to color-hover then in the css code, when you do .color-hover, itll work

that is what I did, Seth - I put color-hover in the class field in the Advanced tab of the button settings in BB

[Content Hidden]

Instead of putting your code into custom code in Dynamik, try adding it to the CSS tab in your page’s Beaver Builder’s layout tools.

thanks Andrea - that works - sigh :slight_smile:

You’re welcome, Robin! Glad I could help. There are WAY too many places to put code! :slight_smile:

Hi Robin,

Happy to hear you have resolved your issue.


Thanks for jumping in, we appreciate it!