Weebly form: How to align the "send" button?

Hi there! I'm trying to edit the CSS, I know that the form fields are a table, but I can't move the "Send" button to be on the same line than the fields. 

My theme is this one with a big photo of a burger in the header called Barney's. 

Thank you in advance!

1,682 Views
Message 1 of 7
Report
6 REPLIES 6
Square

Hi @Almenara Can you also post a link to your live site? It's really helpful for others to see it in action. Thanks!

1,655 Views
Message 8 of 7
Report

Hi, it’s not live yet. But it uses the general form element in Weebly, which is the same. In every theme, and independent. The screen capture shows the problem clearly.

The question is how can I put the Send button horizontal aligned with the form fields.

thanks!

1,647 Views
Message 8 of 7
Report

I personally think that a moderator here is useless.

Even a Junior with CSS knowledge could answer this kind of questions 100% accurate in less than 5 minutes each. 

Having to "wait for the community" with absurd replies most of the times, just to have questions solved about Weebly templates is as cheap for Weebly as useless for users. 

On top of that, Forms in Weebly are absolute frustrating and nonsense. 

Tags (1)
1,623 Views
Message 8 of 7
Report
Square

Our Customer Success team doesn't provide assistance with custom HTML and CSS questions; we do have people here in Community that often help ( @ThemeTricks and @braybin come to mind off the top of my head) although it's possible they haven't seen your post yet. I don't mind giving some CSS help myself, although I prefer to limit it to non-destructive overrides you can place in Settings > SEO > Header Code, that way a person isn't stuck with a custom theme. If you don't want to go live with your site yet officially, you could temporarily publish to a Weebly subdomain and block it from being indexed by search engines.

1,617 Views
Message 8 of 7
Report

@Almenara

By only having an image to work with my best guess would be to use a margin in a negative fashion. Typically we use margins to produce space extending outward from an element, but we can also use it to "retract" an element in certain situations. It is hard to gauge exactly what your code would look like apart from something general like:

<style>
.yourButtonsClass {
margin-top: -50px;
}
</style>

Without seeing the page there is no way to know what kind of class or Id your button has, or whether it is nested in a particularly challenging way. You cannot glean these things from an image alone. Aside from that point you are correct: something like this is indeed trivial for those with proper CSS experience.

1,604 Views
Message 8 of 7
Report

I agree with what @braybin said. The button is clearly not on the same HTML line as the rest of the form, which means that if you don't have access to the HTML (which in this case you do not) the only way to move that button is with negative top margin. 

I also agree being able to see the page would be more helpful a screenshot is not very helpful in this case. 

1,601 Views
Message 8 of 7
Report
This thread has been archived and locked. Please start a new thread if you would like to continue the conversation.