Button background color and border is not displaying

The button background color is showing up in the Pro editor but in the front-end background color is not showing up. Please see the below screenshot and the page link. This issue occurs in some random pages. In the below page first button color is not showing up. But color is displaying on hover only.

In the Pro page builder button is displaying properly but it’s not displaying same on the front page

Thank you

Hi Joy,

I checked the front end of the website, and I see that the background color is not applied in the code. I click the button below and it works correctly. Therefore I think this is related to that specific button and not something related to cache or anything.

I suggest that you create preset of the button that works correctly, and use that preset to add a new pattern instead of the corrupt one.

You can save a preset by checking the options at the beginning of the control group:

kindly get back to us with the result of the steps above and URL/User/Pass of your WordPress dashboard using the Secure Note functionality of the post to follow up the case if you still have problems.

Thank you.

Hi @christopher

I already tried creating a preset. But the button color is not applying on the front end. This issue happens many random pages. Please see the below page. For now, I added a custom class to fix this issue temporarily.


.request-demo-btn {
background-color: rgb(15,128,190);
border-radius: 1em;
}


.contact-button {
border-radius: 1em 1em 1em 1em;
font-size: 1em;
background-color: rgb(109,179,63);
}

I pasted login details in the secure note.

Thank you

Hi Joy,

We are sorry you are having this issue. I can confirm there’s an issue in CSS generation.

Hi @lely

I tried installing a new pro theme to staging site but still, it didn’t resolve the issue. Please have a look at the staging site.

Thank you

Hi Joy,

May I know the login for htaccess credentials for staging?

image

I can’t reproduce this issue on my install so we may need to check your setup further.

Thanks!

Hi @rad

I pasted htaccess credentials.

Thanks

Hello Joy,

After a thorough investigation, I found out the somewhere in one of the elements in your custom footer you added an invalid custom inline css .footer-2 which resulted the issue in all of your pages. The invalid code affected the custom css and it is the reason by the button styles were not applied on the live view of the page.

  • JXKJkZsPQoCy6uDM0YO1DQ

So I went ahead and removed the broken code. The background color, border radius and other styles were now applied to the button.

Kindly check your site now.

Thank you @ruenel

You’re welcome Joy!
We’re just glad that we were able to help you out.

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.