Graphic not showing up on print\submit\clear buttons

  • ztwersky
    Asked on August 30, 2014 at 9:07 AM

    As you see in the picture, there are two problems. 1, the buttons are not graphical although I picked a graphical button. 2, the printer logo on the printer button is messed up. What to do? Thank you.

    Jotform Thread 422603 Screenshot
  • Welvin Support Team Lead
    Replied on August 30, 2014 at 11:55 AM

    Hi,

    I've fixed it for you. In the editor:

    Graphic not showing up on print\submit\clear buttons Image 1 Screenshot 30

    Live Form:

    Graphic not showing up on print\submit\clear buttons Image 2 Screenshot 41

    Thank you!

  • ztwersky
    Replied on August 30, 2014 at 12:03 PM

    Wow Thanks! Was this your change in the css:

     

    #other_7, #other_9 {
    margin-top:5px;
    }
    #id_2 .form-input-wide, #id_6 .form-input-wide {
    padding-right:175px;

     

    ?

     

    I don't remember seeing that before.

     

    Also, I see the graphics show up on your browser. On mine, it's still grey buttons. I guess it's an issue by me.

  • Welvin Support Team Lead
    Replied on August 30, 2014 at 1:20 PM

    These are the custom CSS codes added to the bottom of the existing ones:

    .form-submit-print img {

    margin-left: 0px;

    margin-right: 3px;

    margin-top: -3px;

    }

    I think so, it's an issue to your end. Please kindly clear your browser cookies and caches to start a fresh session.

    Thank you!

  • ztwersky
    Replied on August 30, 2014 at 1:27 PM

    And what's the code for the "I accept" widget that whatever I try, I can't get it to the right side or even centered. It's stuck to the left. All of my CSS is to the right. It's the only thing that won't move.

  • ztwersky
    Replied on August 30, 2014 at 1:32 PM

    Ok, I think with firebug I can see the names of the elements.

     

  • Elton Support Team Lead
    Replied on August 30, 2014 at 10:51 PM

    @ztwersky 

    Yes, you can use Firebug. It's a good web development tool for debugging, editing and inspecting web elements.

    Should you have any other questions, feel free to contact us again.

    Cheers!

  • ztwersky
    Replied on August 31, 2014 at 2:11 AM

    There are no errors in the console of firebug. Look at the picture, In the edit window the buttons look ok but in the preview window the css messes it up. Now what? Thank you.

    Graphic not showing up on print\submit\clear buttons Image 1 Screenshot 20

  • ztwersky
    Replied on August 31, 2014 at 2:15 AM

    In Firefox, the results look like the Jotform preview. In IE and chrome, the buttons are aligned but have both text on them like in this picture:

     

    Graphic not showing up on print\submit\clear buttons Image 1 Screenshot 20

     

    {Your site won't let me upload another picture. This happened yesterday too. It shows the picture before I post but doesn't post it}

     

     

  • Elton Support Team Lead
    Replied on August 31, 2014 at 7:48 AM

    Ok, got it. :)

    It doesn't appear properly on firefox because the buttons has greater padding compared to Chrome. Removing the print button margin should fixed it. Add this CSS code to your form.

    .form-submit-print{

    margin-left:0 !important;

    }

    Thanks!

  • ztwersky
    Replied on August 31, 2014 at 7:54 AM

    When I went to check now, the buttons were fine even before I changed the code. I put in your code anyway, just in case. So many things change with your form from hour to hour. It's strange. Thank you.