inputEx - Styling Buttons

Styling the buttons

Let's add a different background on buttons

/*******************************
		   * JS
		   *******************************/
      	var form = new inputEx.Form({
      	   id:'sampleForm', 
      	   parentEl: 'container1', 
      	   fields: descriptedFields, 
      	   legend: 'User Informations',
      	   buttons:[
      	      /*
      	      *
      	      * Note that we use "type:'submit-link'" or "type:'link'" buttons here because they
      	      * are rendered with a different DOM that is easier to style in a cross-browser way
      	      * than "type:'submit'" (<input type="submit" />).
      	      *
      	      */
      	      {type: 'submit-link', value: 'Submit Form'},  /* classic form submit triggered, as with type:'submit' */
      	      {type: 'link', value: 'Cancel', onClick:function(e) {form.clear();} /* reset inputEx form */
      	   ]
      	});
   
		   /*******************************
		   * CSS
		   *******************************/
         a.inputEx-Button {
            /* Sliding right image */
            background: transparent url('assets/images/button_right.png') no-repeat scroll top right; 
            display: block;
            float: left;
            height: 34px; /* CHANGE THIS VALUE ACCORDING TO IMAGE HEIGHT */
            margin-right: 6px;
            padding-right: 20px; /* CHANGE THIS VALUE ACCORDING TO RIGHT IMAGE WIDTH */
            text-decoration: none;
            color: #000000;
            font-family: Arial, Helvetica, sans-serif;
            font-size:12px;
            font-weight:bold;
            cursor:pointer;
         }
         a.inputEx-Button span {
            /* Background left image */ 
            background: transparent url('assets/images/button_left.png') no-repeat; 
            display: block;
            line-height: 22px; /* CHANGE THIS VALUE ACCORDING TO BUTTON HEIGHT */
            padding: 7px 0 5px 18px;
            cursor:pointer;
         } 
         a.inputEx-Button:hover span{
            text-decoration:underline;
         }