Custom CSS send button does not work

  • Resolved fra8719

    (@fra8719)


    5 years, 2 months ago

    Dear all,
    I would like to custom the send button style as all buttons in the rest of my website (dark green border, white background, light green hover color etc…)

    First, I have been simply trying to copy and paste the code in your article: https://wpforms.com/docs/how-to-customize-the-submit-button/#submit-text
    which I attach here:
    div.wpforms-container-full .wpforms-form input[type=submit],
    div.wpforms-container-full .wpforms-form button[type=submit] {
    background-color: #eee; /* Grey background */
    border: 1px solid #ddd; /* Dark grey border */
    color: #333; /* Black text color */
    font-size: 1em; /* Size of text */
    padding: 10px 15px; /* Distance between text and border */
    }

    Unfortunately nothing change in my website. I insert your code in my web site using the Simple Custom CSS plugin and also via Appearance / Customize.

    I have been trying to refresh cache and changing browser…. nothing.

    Do you what could be the issue? Maybe I need to be more specific in the CSS selector?

    Thanks a lot

    The page I need help with: [log in to see the link]

Viewing 2 replies - 1 through 2 (of 2 total)
  • Plugin Support Ethan Choi

    (@ethanchoi)

    Hi @fra8719,

    You can consider adding the !important tag to your CSS style values. This will allow the CSS to override existing styles. Here’s how that code snippet might look:

    div.wpforms-container-full .wpforms-form input[type=submit],
div.wpforms-container-full .wpforms-form button[type=submit] {
    background-color: #eee !important; /* Grey background */
    border: 1px solid #ddd !important; /* Dark grey border */
    color: #333 !important; /* Black text color */
    font-size: 1em !important; /* Size of text */
    padding: 10px 15px !important; /* Distance between text and border */
}

    Hope this helps!

    • This reply was modified 5 years, 2 months ago by Ethan Choi.
    Thread Starter fra8719

    (@fra8719)

    It worked perfectly.
    Thanks a lot

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘Custom CSS send button does not work’ is closed to new replies.