Title: Conditional Fields Groups get deleted + select2 styling
Last modified: May 19, 2023

---

# Conditional Fields Groups get deleted + select2 styling

 *  Resolved [leofromtheorck](https://wordpress.org/support/users/leofromtheorck/)
 * (@leofromtheorck)
 * [3 years ago](https://wordpress.org/support/topic/conditional-fields-groups-get-deleted-select2-styling/)
 * Hey, first of all: this plugin has been an absolute blessing for me! Thank you
   so much for creating it!
 * I have looked up my problem on this forum multiple times and I hope I didn’t 
   overlook anything. I have seen a nine month old thread with the same problem,
   but it seemed to be resolves by updates of both plugins (this and conditional
   fields). 
   I am on the newest version of all plugins. My problem is: If I wrap
   my conditional fields group around my field like this, meaning directly around
   the div element containing the field, my [group] tags stay. If I wrap the whole
   container-div with the [group] tag, they immediately disappear. That would not
   be a problem of course, but if I don’t wrap the containers with it as well, I
   get like a weird look on the front-end of my form. You can see this on my page
   link. So I would want to hide or show the container-elements also based on conditional
   logic. What am I missing here? How can I get my group-tags to stay in my HTML?
   Similar but not entirely related, maybe someone knows an easy answer to this:
   I haven’t been able to style my select2 elements (took them out for now), especially
   the font color. Tried everything I could find online and watched videos, but 
   my the font color never changes, not with !important, not with very specific 
   selectors. Is there a trick? I haven’t worked with select2-elements before, so
   I feel like I’m just simply not seeing something. Thank you SO MUCH in advance!
 * The page I need help with: _[[log in](https://login.wordpress.org/?redirect_to=https%3A%2F%2Fwordpress.org%2Fsupport%2Ftopic%2Fconditional-fields-groups-get-deleted-select2-styling%2F%3Foutput_format%3Dmd&locale=en_US)
   to see the link]_

Viewing 3 replies - 1 through 3 (of 3 total)

 *  Plugin Author [Aurovrata Venet](https://wordpress.org/support/users/aurovrata/)
 * (@aurovrata)
 * [3 years ago](https://wordpress.org/support/topic/conditional-fields-groups-get-deleted-select2-styling/#post-16779286)
 * > Hey, first of all: this plugin has been an absolute blessing for me! Thank 
   > you so much for creating it!
 * wc, glad you find it useful. Consider leaving a review when you have a moment
   to spare.
 * > If I wrap the whole container-div with the [group] tag, they immediately disappear.
 * Ya, am aware of this [issue](https://github.com/aurovrata/cf7-grid-layout/issues/34),
   which will be resolved in v5.0 which I am currently developing. It is fixed in
   the v5.0beta9 and I hope to get the first release candidate in about a month’s
   time. It’s been slow progress as a result of a bout of COVID and having to shift
   home to a new city 🙂
 * > What am I missing here? How can I get my group-tags to stay in my HTML?
 * so in v4 the problem is that the UI editor attempts to convert your HTML structure
   into its UI equivalent and the algorithm to do this has been designed to handle
   container level [group] tags and therefore strips them. One way around this problem
   is to first complete your form design in the UI, then in the HTML editor, wrap
   your entire HTML with a simple `<div>` element which will disable the UI editor
   altogether and at which point your can add your `[group]` tags in the HTML editor
   and save your form.
 * > I haven’t been able to style my select2 elements
 * you tried with the custom CSS editor (built-in this plugin)?
 * I haven’t tried styling select2 beyond the default, although it should be possible.
   However, there is an alternative HTML [Hybrid-dropdown](https://aurovrata.github.io/hybrid-html-dropdown/examples/)
   field you can use if you don’t see the select2 specific funcitonality. these 
   have been designed specifically for ease of styling.
 *  Thread Starter [leofromtheorck](https://wordpress.org/support/users/leofromtheorck/)
 * (@leofromtheorck)
 * [3 years ago](https://wordpress.org/support/topic/conditional-fields-groups-get-deleted-select2-styling/#post-16779473)
 * Thank you so much for your thorough answer! Immediately left my review 🙂 
   Great
   explanation as well. I will for now use the method you suggested and wrap the
   whole form in a div once I’m done and wait for the release of the update for 
   now. It’s so great to find a plugin that keeps improving! I will also checkout
   the hybrid html dropdown. I tried styling in the custom CSS tab that comes with
   your plugin but no matter which selectors I worked with I couldn’t get my changes
   to show. But I have the sneaking suspicion that this might just have to do with
   my global design settings and not with your plugin at all, just thought I’d see
   if maybe someone had the same issue I had. Anyways, thanks again, super super
   helpful 🙂
 *  Plugin Author [Aurovrata Venet](https://wordpress.org/support/users/aurovrata/)
 * (@aurovrata)
 * [3 years ago](https://wordpress.org/support/topic/conditional-fields-groups-get-deleted-select2-styling/#post-16779681)
 * great, glad you are able to resolve your issues.
 * > I tried styling in the custom CSS tab that comes with your plugin
 * wrt to styling, its important to override the CSS rules set by the plugin (inspect
   the element your want to style and make sure your custom CSS rule has a higher
   priority than that set by the plugin styles). If `!important` doesn’t work then
   likely your custom css is not being loaded. The plugin has a CSS editor specific
   for the form, which saves a custom CSS stylesheet in your child theme and loads
   only when the form page is being loaded. That should allow you to override in
   global settings.
 * Wrt to tabs, v4 uses jQuery UI tabs and styles… this is being removed in v5 and
   replaced with pure CSS tabs instead.

Viewing 3 replies - 1 through 3 (of 3 total)

The topic ‘Conditional Fields Groups get deleted + select2 styling’ is closed to
new replies.

 * ![](https://ps.w.org/cf7-grid-layout/assets/icon-256x256.png?rev=1834229)
 * [Smart Grid-Layout Design for Contact Form 7](https://wordpress.org/plugins/cf7-grid-layout/)
 * [Frequently Asked Questions](https://wordpress.org/plugins/cf7-grid-layout/#faq)
 * [Support Threads](https://wordpress.org/support/plugin/cf7-grid-layout/)
 * [Active Topics](https://wordpress.org/support/plugin/cf7-grid-layout/active/)
 * [Unresolved Topics](https://wordpress.org/support/plugin/cf7-grid-layout/unresolved/)
 * [Reviews](https://wordpress.org/support/plugin/cf7-grid-layout/reviews/)

 * 3 replies
 * 2 participants
 * Last reply from: [Aurovrata Venet](https://wordpress.org/support/users/aurovrata/)
 * Last activity: [3 years ago](https://wordpress.org/support/topic/conditional-fields-groups-get-deleted-select2-styling/#post-16779681)
 * Status: resolved