CSS-Coding not functioning - gets always overwritten

Hey there, I need you help. I currently want to customize a wpform (change font-size, font-style) with css on my page https://stadtwerke-monitor.de/

When loading, you can see that it takes some code. However, after half a second it gets overwritten. Unfortunately, I couldn t find any additional css coder somehwere and was wonder8ing whether this is related to cornerstone. Grateful for your help.

Hello Bjorn,

Thanks for writing in! The sudden change in font is because of the form’s styling and the text element’s default settings. Please edit the page back in Pro editor and remove the text element. Please use the content area element instead and then insert the form shortcode or form code which ever you are using.

Hope this helps. Please let us know how it goes.

He there, man thanks. Unfortunately it does not change. It works while being in Cornerstone but when I press save and refresh the page it is still the same.

I have the form now on the this lnadingpage within the content area element.

Hi @Bstresse,

Can you provide us with your custom CSS you’re using?

I couldn’t find any custom CSS on that page. Please also make sure that you’ve added the closed bracket (}) in your custom CSS codes.

Thank you.

Hey Thai,

many thanks for your advice.

I no added

“div.wpforms-container-full .wpforms-form button[type=submit] {
background-color: #B40404; /* Grey background /
border: 13px solid #ddd; /
Dark grey border /
color: #333; /
Black text color /
font-size: 5em; /
Size of text /
padding: 10px 15px; /
Distance between text and border */
}”

to the element css. It looks ugly but it is for testing purpose.Finally I would like to change the button, size of the font and stlye of the font (helvetica). Thanks for your help.

Hi Björn,

It seems the default CSS of WPForms has overrided your custom CSS. Please add the body before the selector to make it more priority than the default CSS:

body div.wpforms-container-full .wpforms-form button[type=submit] {
    background-color: #B40404; /* Grey background */
    border: 13px solid #ddd; /* Dark grey border */
    color: #333; /* Black text color */
    font-size: 1.4em; /* Size of text */
    padding: 10px 15px; /* Distance between text and border */
    font-family: Helvetica,Arial,sans-serif;
}

Hope it helps :slight_smile:

1 Like

Thanks. It works

You’re welcome!
Thanks for letting us know that it has worked for you.

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