widgets are not affected by main CSS

  • Profile Image
    iCare24Group
    Asked on October 01, 2019 at 04:54 AM

    Hi can someone urgently help with CSS edits

    any part of the form that contains a widget doesnt seem to pull the master CSS 

    and as such you cannot click continue or it looks out of place?


  • Profile Image
    Richie_P
    Answered on October 01, 2019 at 07:25 AM

    Some widgets may not be affected by your master CSS as they are within an Iframe.

    We recommend using the widgets custom CSS option if you wish to edit the widget with CSS.

    Can you please share to us the widget fields and what changes would you like to make?

    Looking forward for your response.

  • Profile Image
    iCare24Group
    Answered on October 01, 2019 at 07:27 AM

    i just need it to be within the frame and not cover buttons.

    the Terms and conditions are exactly the same issue.


    td.col1 select {

    width:250px;

    }

    td.col2 select {

    width:250px;

    }

    .add, .remove{

    width:250px;

    height:35px;

      border-width: 1px;

      border-style: solid;

      border-color: #3aaf50;

      background: #404069 !important;

       text-shadow: none;

       font-weight:900;

       color: #3aaf50 !important;

    }

    is the current CSS for the first widget (Experience) 

    but on the form it covers the next buttons. it doesn't scale with the form.?


    the Terms and conditions are the same

  • Profile Image
    Richie_P
    Answered on October 01, 2019 at 09:13 AM

    It seems a divider is covering your configurable list widget and button.

    You may add this CSS to allow the add another button to work.

    #id_477{

    z-index:-1;
    }

    To fix the pagebreak buttons for your terms and condition you may add this custom CSS

    #cid_387{

    margin-top:230px;
    display: block;
    }

    Both custom CSS should be add in your Form Designer CSS.

    Guide:-How-to-Inject-Custom-CSS-Codes