Injected CSS content appears twice

  • Profile Image
    vgamolsky
    Asked on January 24, 2017 at 06:33 PM

    I inserted custom CSS content and it appears twice on the form.

    Here is the picture:

     

     

    Here is the corresponding CSS snippet:

    .form-product-details span:before {
        content : "- item value: ";
        font-weight : 400;
    }
     

    You can see double entry in the design: https://www.jotform.com//?formID=62785245749167#design

    and preview: https://www.jotform.us/form/62785245749167

    Can you fix this, please?

     

    Victor

  • Profile Image
    Kevin_G
    Answered on January 24, 2017 at 11:14 PM

    Please, replace the given code with this one: 

    .form-product-details {

        content : "- item value: ";

        font-weight : 200;

    }

    It should show one text only.

     

  • Profile Image
    vgamolsky
    Answered on January 25, 2017 at 01:12 PM

    The fix you propose does not work - the form does not show any " - item value: " text when the fix is applied.

     

    My original CSS injected snippet was:

    .form-product-details span:before {
        content : "- item value: ";
        font-size : 14px;
        font-weight : 400;
    }

    Feel free to remove it from the form or make changes otherwise, I just need it working - showing correctly. If you have any other idea of how to insert "- item value: " after the product name and before the price, please advise.

     

    Thanks,

     

    -Victor

  • Profile Image
    Mike_G
    Answered on January 25, 2017 at 01:35 PM

    The CSS codes you added above will add the content to both <span> under .form-product-details that is why you're seeing two "-item value:".

    Please use the CSS codes provided by my colleague, Kevin_G, and add ":before" after the class .form-product-details

    .form-product-details:before {

        content : "- item value: ";

        font-weight : 200;

    }

  • Profile Image
    vgamolsky
    Answered on January 25, 2017 at 01:38 PM

    Excellent, thank you!