[Resolved] Button styles wont stick

[Author]

Posts

[lesleeL]

I cant get all the styling to stick in my css. Most of it does, but the border and border width will not. I cant seem to find the conflict. First link is what it should look like and the second is current that is not working.

hidden link

hidden link

[Minesh]

Hello. Thank you for contacting the Toolset support.

I see you have added many inline styles to the element and many other CSS also overrides the CSS.

Can you please share admin access details so I can check and try to remove inline CSS code.

*** Please make a FULL BACKUP of your database and website.***
I would also eventually need to request temporary access (WP-Admin) to your site. Preferably to a test site where the problem has been replicated if possible in order to be of better help and check if some configurations might need to be changed.

I have set the next reply to private which means only you and I have access to it.

[lesleeL]

What email should I send to?

[Minesh]

Can you please share in what timezone you require support so we can do our best to offer you quick support you.

On my profile you can see my working hours:
- https://toolset.com/forums/users/minesh/

However, I'm not sure why you are mixing here two things. I can see you do not setup the things as expected as you copy image and text and below what you added View's shortcodes.

At the moment on your page we suggest only to add one page builder. Here is the Doc that should help you to know how you can build such hero section where you want to display text on image:
- https://toolset.com/course-lesson/creating-a-hero-section/

If you still want to built such section using Divi you should check the following article:
- hidden link
- hidden link

The ticket you crated here is more about how to display text/button over image using divi builder. You may also check with divi support. if you still need any assistance with Toolset, please do not hesitate to get in touch with us.

[lesleeL]

My timezone is PST. Is there a support person who works in PST?

I did not set this up in Divi. I set it up in Gutenberg. Yes it has Divi header and footer from template.
It looks like you edited the page with Divi, I did not. This broke the search, so I will have to redo it.

You did not tell me why some of my styles are not working. You seem to not understand. I need chat support. I am not getting the help I need and its taking too long.

[lesleeL]

I tried the method you sent, which is basically how I set this up. With slight differences, with the same result. Some of my styles work but not all. Please assist. Again, I did this in gutenburg and not divi.

[Minesh]

I tried to contact supporter who works closely in this timezone but seems he is busy.

What if you try to use the following CSS:

.where-to-buy-button a.wp-block-button__link {
border: 5px solid #DFDCCA !important;
}

This will add the same border color for the Where To Buy button as you shared with the following sample page:
- hidden link

[Minesh]

I also see the text in button is in uppercase and font is also different.

I've applied all things to make copy of your reference button and you should try to add the following custom CSS:

.where-to-buy-button a.wp-block-button__link {
border: 5px solid #DFDCCA !important;
text-transform: uppercase;
font-family:'Antonio',sans-serif !important;
color: #939498!important;
background-color: rgba(255,255,255,0.8) !important;
}

I can see its working, please check the following screenshot:
- hidden link

[lesleeL]

Yes thank you!

Adding this a.wp-block-button__link made things work. The only issue I have now is the width.

[Minesh]

You can add the width to the CSS code I shared:

.where-to-buy-button a.wp-block-button__link {
border: 5px solid #DFDCCA !important;
text-transform: uppercase;
font-family:'Antonio',sans-serif !important;
color: #939498!important;
background-color: rgba(255,255,255,0.8) !important;
width: 229px !important;
}

You are welcome to add and adjust the CSS code I shared as required.

[lesleeL]

My issue is resolved now. Thank you!