What is JotForm?
JotForm is a free online form builder which helps you create online forms without writing a single line of code. No sign-up required.

At JotForm, we want to make sure that you’re getting the online form builder help that you need. Our friendly customer support team is available 24/7.

We believe that if one user has a question, there could be more users who may have the same question. This is why many of our support forum threads are public and available to be searched and viewed. If you’d like help immediately, feel free to search for a similar question, or submit your question or concern.


  • Profile Image

    Need Help Removing a Border in CSS

    Asked by unruhfurniture on January 21, 2017 at 09:01 PM

    Can you help me to take away the background shadow border around this form? I attached a screenshot of what I am trying to do. Here is what the CSS file currently looks like. Thanks for the help!

     

    #header_5 {

        margin-top : 15px;

    }

     

    body, .form-all {

        background : none !important;

    }

     

    .form-textbox, .form-textarea, .form-radio-other-input, .form-checkbox-other-input, .form-captcha input {

        box-shadow : 0px 0px 0px !important;

    }

     

    .form-all {

        -webkit-border-radius : 10px;

        -moz-border-radius : 10px;

        border-radius : 10px;

        border : 0;

    }

     

    .form-submit-button {

        background : #CAB598 !important;

        color : #fff;

        -webkit-border-radius : 5px;

        -moz-border-radius : 5px;

        border-radius : 5px;

        border : 0;

        height : 60px;

        font-size : 30px !important;

        text-shadow : 0 0px #000 !important;

    }

     

    .form-label-top {

        display : none;

    }

     

    .form-textbox {

        padding-left : 75px;

        font-size : 30px;

        font-family : 'Muli';

        border : 0;

        -webkit-border-radius : 2px;

        -moz-border-radius : 2px;

        border-radius : 5px;

    }

     

    .form-line {

        padding-top : 0;

        padding-bottom : 10;

        margin-top : 0;

        margin-bottom : 0;

    }

     

    #id_8 {

        margin-top : 0px;

        margin-bottom : 10px;

        border : 0;

    }

     

    .form-header-group {

        border : 0;

    }

     

    .form-subHeader {

        text-align : center;

        font-size : 16px;

    }

     

    #cid_1:before {

        content : url('https://s3-eu-west-1.amazonaws.com/uploads-eu.hipchat.com/46354/310582/tKAptApa5nRK6tz/Screen%20Shot%202014-09-26%20at%203.54.38%20PM.png');

        position : absolute;

        top : 17px;

        left : 45px;

        width : 46px;

        height : 38px;

    }

     

    #cid_3:before {

        content : url('https://s3-eu-west-1.amazonaws.com/uploads-eu.hipchat.com/46354/310582/aPYZtEm9BtnDnE6/Screen%20Shot%202014-09-26%20at%203.54.43%20PM.png');

        position : absolute;

        top : 17px;

        left : 45px;

        width : 46px;

        height : 38px;

    }

     

    #cid_4:before {

        content : url('https://s3-eu-west-1.amazonaws.com/uploads-eu.hipchat.com/46354/310582/z8j4pH8b5Ca5OM3/Screen%20Shot%202014-09-26%20at%203.54.46%20PM.png');

        position : absolute;

        top : 2px;

        left : 41px;

        width : 46px;

        height : 38px;

    }

     

    .form-header {

        font-size : 56px;

        font-family : 'Muli';

    }

     

    #input_1 {

     

    }

     

    .form-input-wide div {

     

    }

     

    .header-logo-left {

     

    }

     

     

    Page URL:
    https://form.jotform.com/70206977989172

    Screenshot
  • Profile Image
    JotForm Support

    Answered by Jim_R on January 22, 2017 at 05:00 AM

    On the .form-all section of the CSS Codes you pasted here, append the following lines:

       -webkit-box-shadow: none;

       -moz-box-shadow: none;

       box-shadow: none;

    I'll list the original and modified code chunk for .form-all so it's easier to see the difference.

    ORIGINAL:

    .form-all {

       -webkit-border-radius : 10px;

       -moz-border-radius : 10px;

       border-radius : 10px;

       border : 0;

    }

    MODIFIED:

    .form-all {

       -webkit-border-radius : 10px;

       -moz-border-radius : 10px;

       border-radius : 10px;

       border : 0;

       -webkit-box-shadow: none;

       -moz-box-shadow: none;

       box-shadow: none;

    }

    RESULT:

  • Profile Image

    Answered by unruhfurniture on January 22, 2017 at 09:45 AM
    Thanks so much, but I'm afraid it still didn't work. Here's a link to the
    published form:
    https://form.jotform.com/70206977989172
    And here's what the CSS looks like. Do you see someone I have wrong in the
    CSS?
    #header_5 {
    margin-top : 15px;
    }
    .form-textbox, .form-textarea, .form-radio-other-input,
    .form-checkbox-other-input, .form-captcha input {
    box-shadow : 0px 0px 0px !important;
    }
    .form-all {
    -webkit-border-radius : 10px;
    -moz-border-radius : 10px;
    border-radius : 10px;
    border : 0;
    -webkit-box-shadow : none;
    -moz-box-shadow : none;
    box-shadow : none;
    }
    .form-submit-button {
    background : #CAB598 !important;
    color : #fff;
    -webkit-border-radius : 5px;
    -moz-border-radius : 5px;
    border-radius : 5px;
    border : 0;
    height : 60px;
    font-size : 30px !important;
    text-shadow : 0 0px #000 !important;
    }
    .form-label-top {
    display : none;
    }
    .form-textbox {
    padding-left : 75px;
    font-size : 30px;
    font-family : 'Muli';
    border : 0;
    -webkit-border-radius : 2px;
    -moz-border-radius : 2px;
    border-radius : 5px;
    }
    .form-line {
    padding-top : 0;
    padding-bottom : 10;
    margin-top : 0;
    margin-bottom : 0;
    }
    #id_8 {
    margin-top : 0px;
    margin-bottom : 10px;
    border : 0;
    }
    .form-header-group {
    border : 0;
    }
    .form-subHeader {
    text-align : center;
    font-size : 16px;
    }
    #cid_1:before {
    content : url('https://s3-eu-west-1.amazonaws.com/uploads-eu.
    hipchat.com/46354/310582/tKAptApa5nRK6tz/Screen%20Shot%
    202014-09-26%20at%203.54.38%20PM.png');
    position : absolute;
    top : 17px;
    left : 45px;
    width : 46px;
    height : 38px;
    }
    #cid_3:before {
    content : url('https://s3-eu-west-1.amazonaws.com/uploads-eu.
    hipchat.com/46354/310582/aPYZtEm9BtnDnE6/Screen%20Shot%
    202014-09-26%20at%203.54.43%20PM.png');
    position : absolute;
    top : 17px;
    left : 45px;
    width : 46px;
    height : 38px;
    }
    #cid_4:before {
    content : url('https://s3-eu-west-1.amazonaws.com/uploads-eu.
    hipchat.com/46354/310582/z8j4pH8b5Ca5OM3/Screen%20Shot%
    202014-09-26%20at%203.54.46%20PM.png');
    position : absolute;
    top : 2px;
    left : 41px;
    width : 46px;
    height : 38px;
    }
    .form-header {
    font-size : 56px;
    font-family : 'Muli';
    }
    #input_1 {
    }
    .form-input-wide div {
    }
    .header-logo-left {
    }
    *Sam Unruh*
    Owner, Unruh Furniture
    cell: 816.808.5259
    ...
  • Profile Image
    JotForm Support

    Answered by Jan on January 22, 2017 at 12:24 PM

    Please try inserting this custom CSS code in your form:

    .supernova .form-all {
    border: 0 !important;
    box-shadow: none !important;
    -moz-box-shadow: none !important;
    -webkit-box-shadow: none !important;
    }

    Here's the result:

    Hope that helps. Thank you.

  • Profile Image

    Answered by unruhfurniture on January 22, 2017 at 03:45 PM
    Thanks so much! That did the trick.
    But now when I went to embed it I ran
    into a little trouble getting the correct size. Would you take a look at my
    questions in the attached screenshot and let me know if you can help me
    here too.
    Thanks so much!
    Sam
    *Sam Unruh*
    Owner, Unruh Furniture
    cell: 816.808.5259
    ...
  • Profile Image
    JotForm Support

    Answered by Jan on January 22, 2017 at 05:21 PM

    Glad to hear that. I need to create a separate thread for your next issue, please refer to this link: https://www.jotform.com/answers/1042498.

    Thank you.