Border width

Hey there, @happyuser99! Happy to help!

Please try this code instead…

.happyforms-styles input[type=submit].happyforms-button--submit, 
.happyforms-styles input[type=submit][disabled].happyforms-button--submit, 
.happyforms-styles button.submit.happyforms-button--submit, 
.happyforms-styles button[disabled].submit.happyforms-button--submit {
  border: 10px solid #ff0000 !important;
}

That should do the trick. You can swap out #ff0000 for any hex color you prefer ??

Hi there,

Thank you for your response! This unfortunately did not work. I noticed that in your default CSS there is already this line:

border: 1px solid transparent !important;

Could it be that the !important there cannot be overwritten?

Thanks! ??

Bummer! Would you please try this snippet instead, @happyuser99?

I have a hunch the code I shared previously was a bit too specific.

input[type=submit].happyforms-button--submit, 
input[type=submit][disabled].happyforms-button--submit, 
button.submit.happyforms-button--submit, 
button[disabled].submit.happyforms-button--submit {
  border: 10px solid #ff0000 !important;
}

I hope this helps!

Hi! Thank you very much! Unfortunately, this also does not change the border width. :/

Gosh! This is getting embarrassing ?? Sorry, @happyuser99.

Out of interest, where are you adding these codes snippets? The snippets we’re sharing should work, so I have a hunch something else on your site is overriding it.

Also, can you please share a link to the page you’re working on?

Thanks!

No worries, @thethemefoundry. ??

I use this plugin to add the code. Here a link to the form (please click on Continue first). As you can see, I already used some CSS to style the button. Everything worked except the border width.

Thank you! ??

• This reply was modified 4 years, 6 months ago by happyuser99.

Got it, @happyuser99!

For this customization to work, make sure to pop the above snippet in your form Style step, Additional CSS section. That way, your custom CSS will be prefixed with your form ID, and override HappyForms default styles.

Let us know how that goes!

Thank you @thethemefoundry, this did the trick! I try to keep my custom CSS in one place and never came to the idea to use the Additional CSS section of the plugin. *facepalm*

Awesome! Thanks again!