[Resolved] Button border width

[Ivan]

Hello,

I am trying to give the same look and feel to all buttons on my site. I am struggling a bit with the HappyForms ‘Send’ button. The code below works, just the border-width (border-width: 2px !important;) remains unchanged:

body input[type=submit].happyforms-button--submit {
	border-style: solid !important;
	padding-top: 15px !important;
	padding-bottom: 15px !important;
	padding-left: 25px !important;
	padding-right: 25px !important;
	border-radius: 5px !important;
	border-width: 2px !important;
	font-size: 20px !important;
	transition:.2s background-color ease-in-out, .2s color ease-in-out, .2s border-color ease-in-out, .2s opacity ease-in-out, .2s box-shadow ease-in-out !important;
}

Any idea what could be wrong here?

Thank you,
Ivan

[Leo]

Hi there,

Try this:

.happyforms-styles input[type=submit].happyforms-button--submit {
    border-width: 2px !important;
}

If you use the browser inspector tool, you can see the CSS involved.

[Ivan]

Hi Leo,

This also did not work. The border remains unchanged.

Could it be because the HappyForms CSS already sets border: 1px solid transparent !important;?

Thanks,
Ivan

[Leo]

It could be. You would need to try to overwrite that.

HappyForm’s CSS are tough to overwrite so might be worth checking with their support team.

[Ivan]

Will do, thanks! 🙂

[Leo]

No problem 🙂

[Author]

Posts