Can't edit CSS

[gvanullen]

Hi - I'm trying to update the CSS of my event templates, per this post: https://forums.clickandpledge.com/fo...-in-c-p-events

My instance is missing any reference to the CSS, and instead the dropdown says "Design Selection" and gives left and right as options.

Please advise, thank you!

[gvanullen]

00D1I000003nnIs

[CnP.Support.AM]

Good day @gvanullen

You have selected the Default CSS in DefaultSettings which is the reason you don't see the Custom CSS as an option. Please follow the below image and make the changes then it shows you the option:



Hope that helps.

[gvanullen]

Thanks. For whatever reason, when the iframe loads, it's just totally ignoring me setting the background to transparent.
Have it in the CSS here, and inline as well.

Is this also pulling in bootstrap.min.css? That's where it's being forced to white.

[CnP.Support.AM]

Good day @gvanullen

We reviewed your Template & CSS and found that you have removed the background image tag defined in the HTML editor which is the reason it is not pulling the background image from custom CSS. However, we have included that in the HTML now.

Please see:




We also noticed that the custom class which you have added in the custom CSS is not correct syntax and will not work:

[gvanullen]

Yeah, that was one of several iterations I was trying to force it to be transparent. As I mentioned, it's getting defined in bootstrap.min.css and I am wondering if C&P is pulling that css file in somewhere. I don't see it in the page source, so I have to presume so. There doesn't seem to be anything I can do to force it transparent.

[CnP.Support.AM]

Please note that the bootstrap.min.css is an external file which pulled when the event form generated. Based on the above image we are assuming that you want to give transparent background for the class name .CPEF.

You can override some css properties in your custom CSS by adding !important beside that property as shown below.

.CPEF{
background-color: rgba(255, 255, 255, 0.0) !important;
}

You can change the alpha value in between 0.0-1, where 0 is fully transparent and 1 being opaque.

OR you may simply include Transparent as shown below:

.CPEF{
background-color: transparent !important;
}

Hope that helps.