Re: Custom Form Updates

Liz_Krupka3
Level 2

Custom Form Updates

Hi there -

I am trying to update a few things on a form with the css that you used to be able to use to update them:

1) The form submit button to be lower.

2) The form submit button to the right not the left.

3) Adding more padding in between fields so the form doesn't look smushed together. This isn't working for the form like it used to:

<style>

div.buttonSubmit input, div.buttonSubmit span {

margin-left: 50px;

}

</style>

Any thoughts?

Tags (3)
4 REPLIES 4
SanfordWhiteman
Level 10 - Community Moderator

Re: Custom Form Updates

Do you mean "used to" as in Forms 1.0?

Liz_Krupka3
Level 2

Re: Custom Form Updates

Nope even in forms 2.0 - that was what we used to add/change the button. But that snippet isn't working.

SanfordWhiteman
Level 10 - Community Moderator

Re: Custom Form Updates

That's not standard Forms 2.0 markup.

You want (and should always have wanted)

.mktoButtonRow

for the button row and

.mktoButtonRow .mktoButtonWrap

for the button wrapper and

.mktoButtonRow button

for the button itself.

Dave_Roberts
Level 10

Re: Custom Form Updates

I'll pile on to what Sanford posted here:

1) The form submit button to be lower.

     .mktoButtonRow {margin-top:20px !important;}

This adds a margin to the top of the button row, adjust the "20" for more or less padding.

2) The form submit button to the right not the left.

   .mktoButtonRow {float:right;} 

   .mktoButtonWarp {margin-left:0px !important;}

The first rule pushes the button to the right side of the form, the second clears the default left margin.

3) Adding more padding in between fields so the form doesn't look smushed together. This isn't working for the form like it used to:

   .mktoFormRow {margin-bottom:20px !important;}

Each form row (except the button row) will get this padding. Note that for the last field row, it'll have 20px bottom margin + 20px top-margin for the button row, so a total of 40px from the last field to the button.