X-Email Signup formatting Question

Hi there,

I’m building a test-site at http://biokutatas.decorolux.com/
Near the bottom of the page, I have an email signup. I would like to have it look something like the signup on the bottom of this page:

My question is, how do I position the title - name - email container next to each other, instead of under each other.

Thanks!

Hey,

Thank you for writing in!

I have checked your site and this is caused by columns, so, to solve this faster, you could post some logins details in a secure note and we`d be happy to take a look.

P.S: You can search by “secure note” on this article if you don`t know about this: https://theme.co/apex/forum/t/themeco-support-overview/288

Added secure note.

Hi There,

Please try adding this custom CSS:

  form#x-subscribe-form-308 fieldset {
      float: left;
  }
  form#x-subscribe-form-308 fieldset:first-of-type {
      margin-right: 15px;
 }

From this custom CSS remove margin top is it will be aligned properly:

.x-subscribe-form input[type="submit"] {
   display: inline-block;
   width: 100%;
   margin-top: 0.25em;
    font-size: inherit;
}

Hope this helps.

Hi, I’d love to be able to do this as well, but these instructions didn’t help me. I changed the form number reference to match my form, but still nothing. Any and all formatting guidance would be great.

Hi @djguitar

Thanks for writing around! Can you please share the URL of the page in question so we can take a look and suggest you the solution?

Thanks!

Sure, the contact page is here: http://oliviapopsor.com/contact/
I have a couple of quick iterations of the email form.
I notice that the first one isn’t mobile friendly as well. No big deal at this point, I’m mostly curious to see if the second one can have its fields in a horizontal line.
Thanks

p.s.
I find that the setting for “Max Width” has no effect in my applications.

Hi again,

Thank you for sharing the URL, please add the following CSS code in the Theme Options > Global CSS or in the Customizer via Appearance > Customize > Custom > Edit GLOBAL CSS


@media screen and (min-width: 768px) {
	.tco-subscribe-form:before, .tco-subscribe-form:after {
		content: '';
		display: table;
		clear: both;
	}
	#tco-subscribe-form-1144 fieldset {
		padding: 0;
		margin: 0;
		border: 0;
		float: left;
		width: 30%;
		margin-right: 3%;
	}
	#tco-subscribe-form-1144 input[type="submit"] {
		margin-top: -2px;
	}
}

Please make sure not to share the site credentials in someone else’s thread, the secure note is visible to thread owner as well. Always create a new thread if you need to share the credentials. I’ve removed the secure note from your post, please change the credentials as soon as possible for your own security.

Thanks!

Excellent, thank you very much!

1 Like

Glad we could help.

Cheers!