CSS Code to change the color of button

  • Resolved alphagoldafrica

    (@alphagoldafrica)


    5 years, 7 months ago

    Hi,

    Thank you for your Plugin. Its excellent.

    Please may you assist me with the CSS code to change the color of the “REGISTER” button from blue to red?

    Thank you,

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

Viewing 3 replies - 1 through 3 (of 3 total)

  • Hi @alphagoldafrica,

    To change the button styles, please try the custom CSS below.

    .ur-frontend-form button[type=submit], .ur-frontend-form input[type=submit] {
    background: #0070ff;
    color: #fff;
}

    And for hover effect use the following custom CSS.

    .ur-frontend-form button[type=submit]:hover, .ur-frontend-form input[type=submit]:hover {
    background: #004aa9;
    color: #fff;
}

    You can change the color code as your preference.

    Regards.

    Thread Starter alphagoldafrica

    (@alphagoldafrica)

    Hi,

    I inserted the code above in the css section of the form under Form Settings but the color did not change. The code I entered is as follows:

    .ur-frontend-form button[type=register], .ur-frontend-form input[type=register] { background: #f00202; color: #fff; } .ur-frontend-form button[type=register]:hover, .ur-frontend-form input[type=register]:hover { background: #f00202; color: #fff; }

    What went wrong? Please may you kindly help me fix the issue.

    Thank you

    Hi @alphagoldafrica,

    The above CSS code was for the default layout option. It seems that you have selected the Rounded Edge template. To adjust the button style please copy the following CSS code and paste it to the Additional CSS box.

    .ur-frontend-form.ur-frontend-form--rounded form button[type=submit], .ur-frontend-form.ur-frontend-form--rounded form input[type=submit] {
    background: #f00202;
    color: #fff;
}

.ur-frontend-form.ur-frontend-form--rounded form button[type=submit]:hover, .ur-frontend-form.ur-frontend-form--rounded form input[type=submit]:hover {
    background: #d60000;
    color: #fff;
}

    Hope this helps.

    Regards.

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘CSS Code to change the color of button’ is closed to new replies.