Can't configure the CTA Button

Hi folks, I’m really struggeling with getting my settings for a CTA button right. It seems I’ve somehow completely screwed up my CSS somewhere but can’t find out where. Even though I put the following code in my custom CSS of the widget:

Widget Class: my-cta-button

Custom CSS:

.my-cta-button .roll-button.border{
  background-color: orange;
  border-color: black;
  color: black;

/* On hover state */
.my-cta-button .roll-button.border:hover{
  background-color: black;
  border-color: orange;
  color: orange; 

it does not affect the button at all. The background color seems to remain transparent. And all other setting have no affect either. Something must be overwriting the CSS setting but I don’t know where?!

See here below the Service Type A Section:

Any help would be appreciated.
Cheers, Timo

Hello Timo,

That CSS code won’t work there, try to add it in Dashboard → Appearance → Customize → Additional CSS section.

Also please note that there is black color set somewhere in widget settings, so you either have to remove black color in settings or replace color: orange; with color: orange !important;

Please feel free to ask any other questions that you might have.

Kind Regards, Roman.

Hi Roman,

thank you very much for your help. This worked out (even though I thought I tested every possible way to put it). Since I’m struggeling with these kind of questions due to my lack of understanding occasionally could you prbably give some general advice on CSS hierachy? We do have CSS Settings:

  • within the theme
  • in the Customizer
  • in each PageBuilder Row
  • in each widget
  • and (as I do) in the custom CSS & JS PlugIn

My question is: what CSS Setting overwrites hierachy-wise the other? (Not looking at the !important and transparency setting or at dedicated CSS classes)

Thanks again for your support!

Hello Timo,

I don’t think that there is a certain answer, it depends on which selectors are used by options.

However, if you have some specific issue, please ask, I would be glad to help you.

Kind Regards, Roman.