CSS - Submit Action Edits

The submit area of the form can be quickly customized by copying and pasting the CSS below to the Theme that is applied to the form. The submit area can contain a Next, Previous, and Submit button.


...remove grey footer behind submit button (version 2 forms)

.fsForm .fsSubmit  {
  background-color: transparent !important;


...remove margin from top of submit button (next/previous buttons also)

.fsForm .fsSubmit  {


...hide the submit button on a form

.fsSubmit input.fsSubmitButton  {


...hide the submit button on a multi-page form

.fsSubmit input.fsSubmitButton  {
  display:none !important;


...set a height/width for submit button and round the edges

.fsSubmit input.fsSubmitButton  {
  height:  50px;
  width:  100px;
  border-radius:  5px !important;
  -moz-border-radius: 5px !important;
  -webkit-border-radius: 5px !important;


...hide the previous button from a multi-page form

.fsPreviousButton  {
  display: none;

.fsPagination .fsNextButton  {
float: none;
height: 55px;
width: 150px;


...use your own image for the submit button on a form

.fsSubmit input {
   background: url(http://www.YOUR_URL_HERE.png) no-repeat scroll 0 0 transparent;
   border: medium none;
   height: 100px;
   margin: 0;
   padding: 0;
   width: 300px;

NOTE: When you replace the Submit button with your own image, you need to go to Build > Form Extras > Submit Button and erase the text in the 'Submit' button by deleting all the text shown in the button and then entering a single space in the text field.  You will also need to remove all other Submit button settings, as these will override with the added CSS.  Check out this link to see the step-by-step process.


Next and Previous Buttons on Mobile Forms 

The Next and Previous buttons have alternative CSS when you view the page on mobile forms. You can override these images with additional CSS.


...to change the look of the mobile Next and Previous buttons

@media only screen and (max-width:699px){
   .fsPagination .fsNextButton, .fsPagination .fsPreviousButton, .fsSubmitButton {
     background: #47DA47 !important;text-indent:0;}
Was this article helpful?
1 out of 6 found this helpful