Can I change size of image button

  • Profile Image
    leilee
    Asked on October 16, 2012 at 05:59 PM

    I used an image from another source for my 'submit' button. The image is too big for the form. How can I reduce the size?

     

     

  • Profile Image
    Rodjit
    Answered on October 16, 2012 at 06:11 PM

    Hi,

    You can either edit your image to any image editor or by injecting custom CSS codes;

    #input_18 {

    height: 40px;

    width: 135px;

    }

    Change the height and width to the size that suit your needs.

    Let us know if you have further questions. Thanks

  • Profile Image
    guest_22896966413063
    Answered on October 16, 2012 at 06:54 PM

    Rodjit's method sounds straightforward.

    However, my 1st thought was to edit the size of the image before uploading it. But I had to use a URL to put into properties where it says Button Image. If I resized the button and saved it in My Pictures, there's no URL for it. So, wondering how to do that?

  • Profile Image
    guest_22896966413063
    Answered on October 16, 2012 at 06:58 PM

    Guys, don't answer yet. Let me try to figure it out.

    Thanks kindly

  • Profile Image
    jonathan
    Answered on October 16, 2012 at 07:02 PM

    Please do let us know of your results. =)

    Thanks.

  • Profile Image
    leilee
    Answered on October 19, 2012 at 10:41 AM

    http://www.jotform.com/?formID=22817655821256

     

    I used Rodgit's method-it was easier.

    Now, I wouldn't mind a smaller image but it wont reduce any further. And the border line doesn't go around the image fully.

    How can I get the border to surround the whole image?

  • Profile Image
    leilee
    Answered on October 28, 2012 at 04:12 PM

    Ok, I understand about the size.

    How do I get the border to go around the entire 'submit' button?

  • Profile Image
    idarktech
    Answered on October 28, 2012 at 04:50 PM

    Copy this code and inject this to your form. This will resize your button image so it will fit exactly on your buttons width.

    .form-submit-button img {

    width: 99px;

    height: 40px;

    }

    Result should be like this:
    If you want the bigger one, let us know so we can adjust the CSS codes for you. Thanks!
  • Profile Image
    guest_23015864990054
    Answered on October 28, 2012 at 10:02 PM

    You have it perfect. However, I did as you suggested but it didn't change. Here's what I have for the css codes:

    .form-required {
    color: pink !important;}#input_18 {.form-submit-button img {width: 99px;height: 40px;}

  • Profile Image
    guest_23027975124049
    Answered on October 29, 2012 at 08:10 PM

    This looks great, thanks. I dont have the border around the image but that's no problem. I'm happy with this.