Hidden Fields and Columns CSS conflict

Support MB Frontend Submission Hidden Fields and Columns CSS conflict

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #44781
    Nicholas CoxNicholas Cox
    Participant

    Hi

    I am using both metabox columns and hidden fields in a front end form and there is an issue with the CSS of the plugin for metabox columns (columns.css) is making hidden field wrappers visible?

    columns.css (this is taking priority over the inline css below)

    .rwmb-column .rwmb-field {
      display: block;
    }

    inline css

    .rwmb-hidden-wrapper {
      display: none;
    }

    https://prnt.sc/LZpnnyQKsizo

    #44801
    PeterPeter
    Moderator

    Hello Nick,

    Are you using custom code to create the CSS on your end? If you want to override the style of columns.css, you can use the !important property.

    .rwmb-hidden-wrapper {
      display: none !important;
    }
    #44880
    Nicholas CoxNicholas Cox
    Participant

    hi

    no im not using custom code, its the css provided by your plugins (inline css in the front end form and columns.css file for metabox). You can see from the screenshot that one is taking priority over the other in the developer toolbar. It's a CSS order priority issue, you need to re-order the css calls or provide a parent id/class before the css call instead of using the !important property (as its not good practice to use it).

    from this

    .rwmb-hidden-wrapper {
      display: none;
    }

    to this

    .rwmb-formx .rwmb-hidden-wrapper {
      display: none;
    }
    #44891
    PeterPeter
    Moderator

    Hello,

    I cannot reproduce the issue on my end. Can you please export the field group to a JSON file and share it here? And let me know how to reproduce it.

Viewing 4 posts - 1 through 4 (of 4 total)
  • You must be logged in to reply to this topic.