Horizontal email sign up form

Support
#1

Hi. I succeeded in making the sign-up form horizontal, however I would like to move the submit button to it’s own row, so that when you resize the site to mobile, it doesn’t interfere with the other fields.

Also, the button styling is rounded, rather than square like the rest of the buttons on the site, can this be changed to be square?

Lastly, I would like to add a small gap between the fields on the sign up form. I find they are too close together. Any help would be greatly appreciated!

#2

Hi,

Please add your site link so that we can give you a proper solution.

Thanks,

#3

sorry for the delayed reply. didn’t get notified there was a response.

#4

Hi There,

Thanks for writing in! Could you please try adding the following CSS rule into your Theme Options > Global CSS area.

.tco-subscribe-form fieldset {
    min-width: 30%;
    margin-right: 3% !important;
}

Hope that helps.

#5

Hi, Thank you for the info, however when I put that in the CSS it looks like the attached image. The sign up form is right justified with no gap.

#6

Hi There,

Thank you for writing in, please add this to your custom CSS.

body .x-subscribe-form fieldset:last-of-type {
	display: block;
    margin: 10px auto 0;
    max-width: 250px;
}

/*properly stacked the fields back in mobile*/
@media (max-width: 480px) {
	body .x-subscribe-form fieldset {
	    display: block !important;
	    max-width: 250px;
	    margin: 10px auto 0;
	}
}

Hope it helps,
Cheers!

#7

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.