Docs

[StudioNeal]

Hello!
I’m trying to customize my contact form so that the name and email boxes align horizontally on the same line with the button.

I’m using this CSS
}body .x-subscribe-form fieldset {
display:inline-block;
vertical-align:center;
}

body .x-subscribe-form fieldset input {
margin:0 !important;
}

body .x-subscribe-form {
width:100%;
max-width:100% !important;
text-align:center;

This seems to be working, however the button is slightly larger and it just looks off. Can I match the button style to the rest of my site and/or adjust the size so that it doesn’t look awkward with the form?

[StudioNeal]

This reply has been marked as private.

[Rupok]

Hi there,

Thanks for writing in! You can add this under Custom > CSS in the Customizer.

#x-subscribe-form-211 .submit {
  height: 36px;
  line-height: 1;
  top: -2px;
}

Hope this helps.

Cheers!

[StudioNeal]

Thank you! That did seem to help, but I think the issue is that the contact form button has a “bottom” that makes it look bigger. Is it possible to remove that or style it to match the other buttons on my site? I’ll add one to that page so you can see the difference.

[Rupok]

Hi there,

Thanks for writing back. Your input fields have static height set and that’s why the button size is different. I think I have already provided the necessary code to fix this and this should do the job. If you need to adjust the CSS, let’s do that or try other CSS if you don’t want to use that.

Cheers!

[Author]

Posts